www.webdeveloper.com
Results 1 to 2 of 2

Thread: Width: Pixels vs Percent

Hybrid View

  1. #1
    Join Date
    Dec 2011
    Posts
    55

    Width: Pixels vs Percent

    I'm trying to fully understand when it is a good idea to set a width in %, and when to set it in pixels.

    For example, I have a 3 column layout I've done, and I set each column's width as a % (all 3 equaling 73% in total to give some white space). But I also set a min-width of a certain pixel width so they only re-size so much So the Div's don't shrink smaller than such things as images within the Div's. I also had issues before implementing this where if the window was re-sized, the div's would shrink, and one might go underneath the other two instead of staying at it's side. This was my original reason for setting a pixel value to min-width.

    Would you say this method is a good idea? Also are there any good guidelines to know when it comes to knowing which value to use for width?

  2. #2
    Join Date
    May 2005
    Location
    Gold Coast (MS)
    Posts
    2,207
    Might help:

    Choosing Dimensions for Your Web Page Layout:

    In Search of the Holy Grail: http://www.alistapart.com/articles/holygrail/
    Introduction to Responsive Web Design: http://www.linkedin.com/news?actionB...3Z-fJK7fpockY1
    http://www.elated.com/articles/choos...b-page-layout/
    How to create flexible sites quickly using standards like CSS and XHTML: http://www.ibm.com/developerworks/web/library/wa-rapid/

    Care With Font Size: http://www.w3.org/QA/Tips/font-size
    Designing for the Web: Resolution and Size: http://sitepointcom.createsend4.com/...yd/birtthtw/h/
    Websites Shouldn’t Look The Same Across Different Browsers: http://www.noupe.com/design/websites...re-is-why.html

    Cross-Browser CSS in Seconds with Prefixr: http://net.tutsplus.com/articles/new...-with-prefixr/
    It’s Not Responsive Web Building, It’s Responsive Web Design: http://www.getfinch.com/finch/entry/...ve-web-design/
    Beginner’s Guide to Responsive Web Design: http://thinkvitamin.com/design/begin...ve-web-design/

    Teach your clients about the mysteries of the web: http://weenudge.com/
    960 Grid System: http://960.gs/

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles