9 {{ upvoteCount | shortNum }}
9 {{ upvoteCount | shortNum }}

webpage self adjusts to match screen size?

by mljohn
6 replies
  • WEB DESIGN
    • |
What do you call and how do I create a webpage that self adjusts to match the screen size of the computer viewing it? I am using Dreamweaver 8.

Thanks

Matt
#adjusts #match #screen #size #webpage
  • Profile picture of the author mywebwork
    By their own nature all basic HTML pages will adjust to the size of the display area. Once you apply style sheets or tables to format text you can either specify a fixed width in pixels or a percentage of the screen width.

    I think the terms you are looking for are "floating" or "fixed" width.

    Bill
    {{ DiscussionBoard.errors[1137609].message }}
  • Profile picture of the author applepie
    I'd suggest to go with a fixed width. It's much cleaner and allow you to control the design in a neat way
    {{ DiscussionBoard.errors[1138904].message }}
  • Profile picture of the author WebStranica
    mljohn,

    You can use liquid layout design.

    Css
    Code:
    #window {
              width: 100%;
  }
    Html
    Code:
    <div id="window"> </div>
    {{ DiscussionBoard.errors[1139866].message }}
  • Profile picture of the author BrainDance
    here is a site I frequent often, this particular page addresses your issue, PLUS gives you a free template to work from
    The Perfect Fluid Width Layout | CSS-Tricks
    hope it helps!
    Linda
    Signature
    ================================
    I am taking on only ecover design work for the next 90 days. Rates are 47.00 for single cover, discounts for multiple..just ask! No payment until completed.     http://www.d27portfolio.com for sample works
    {{ DiscussionBoard.errors[1145904].message }}
  • Profile picture of the author dherbert
    It's called a floating design. I think this is a design of the future. Google SE is a floating design, for example. Sometimes it's hard to control the exact structure of your web content with this design, so you can use hybrid design instead, meaning some elemets will be fixed while other float. I find this the best way to design a webpage.
    Signature
    No one shall expel us from the paradise that Cantor has created for us. David Hilbert

    Music all the brilliant and familiar tunes and memories that mollify our lonely spirits. Silvio Referati
    {{ DiscussionBoard.errors[1146465].message }}
  • Profile picture of the author Mohsin Rasool
    Originally Posted by mljohn View Post

    What do you call and how do I create a webpage that self adjusts to match the screen size of the computer viewing it? I am using Dreamweaver 8.

    Thanks

    Matt
    Hi Matt,

    As already advised you need to put your main div's width in %
    i.e. if it is a div name id Wrapper...
    in Css it should have

    #Wrapper{
    width:99%
    }

    I just wanted to mention one more thing, to save the design from collapsing in a low
    resulotion small screens... please set min-width in a fixed value, for instance in our
    example it becomes...

    #Wrapper{
    width:99%
    min-width:575px
    }

    Best Regards,
    Mohsin Rasool
    http://www.MohsinRasool.com
    Signature
    Warriors4Hire: WordPress & GENESIS Experts | Custom WP Theme | WordPress Troubleshooting | Customizations | WP Security | Responsive Themes

    My Business site: WarMarks - Web Development | My Personal Blog: Mohsin Rasool
    {{ DiscussionBoard.errors[1150144].message }}

Trending Topics