SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Evangelist fs_tigre's Avatar
    Join Date
    Feb 2009
    Location
    Close to Chicago, Illinois
    Posts
    517
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    The best way to make the structure of you page

    Hi,

    I have designed and coded only a few pages using HTML and CSS and I always tend to float everything but looking at other web sites it looks like most of them tend to absolutely position everything.

    My Current structure:
    Code:
    <div id="header">
    	<div id="logo"> Logo goes here </div>
       <ul id="nav"> Nav goes here </ul>
    </div>
    Then I float my header as well as the child divs, but I have seen that most of the programmers/designers absolutely position all these elements, something like this…
    Code:
    <div id="logo"> Logo goes here </div>
     <ul id="nav"> Nav goes here </ul>
    and absolutely positioning them with CSS.

    What would be the best way to create the structure of you site? Is there any benefit of doing it one way over the other?

    I have read a few books but none of them tell you what method to use they just show you how to do it.

    Thanks
    Thank you very much!!!

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,097
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    For the most part, avoid absolute positioning. It takes elements out of the document flow, making it hard to get them to play nicely together. For example, if your main content is absolutely positioned and you have a footer below that, you would have to move the footer manually every time you added content, which is a hopeless situation.

    However, with small items like a logo or a menu within a head section, there's a reasonable argument for placing it absolutely. Just remember, though, that if font sizes are increased significantly, these abs;pos elements might start to overlap rather than reflow. So again, use wisely and with caution.

    Absolute positioning is mainly useful for placing small items here and there on an occasional basis.

    For the most part, if you want things sitting side by side, use floats.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  3. #3
    SitePoint Evangelist fs_tigre's Avatar
    Join Date
    Feb 2009
    Location
    Close to Chicago, Illinois
    Posts
    517
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Very good advice. Thanks a lot for your help and sorry about all questions I have asked today, you are awesome!

    Learning a lot!
    Thank you very much!!!

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,097
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by fs_tigre View Post
    sorry about all questions I have asked today
    No questions, no forum.

    You're welcome!
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  5. #5
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,215
    Mentioned
    58 Post(s)
    Tagged
    3 Thread(s)
    Off Topic:

    actually, it's "no answers, no forum"


    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,097
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Off Topic:

    OK, let's compromise: "No questions = no answers = no forum."
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  7. #7
    SitePoint Evangelist fs_tigre's Avatar
    Join Date
    Feb 2009
    Location
    Close to Chicago, Illinois
    Posts
    517
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you!

    No forum = Less good designers/programmers
    Thank you very much!!!


Bookmarks

Posting Permissions

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