SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Wizard big_al's Avatar
    Join Date
    May 2000
    Location
    Victoria, Australia
    Posts
    1,661
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Basic Layout? (or is it?)

    I have been quite reluctant to move to pure css layouts for some time now (**boo.. hiss**, yes I hear you ).

    So I have given in to peer preasure and will give it a go.

    Now I have a basic layout of a header, left menu and a horizontal menu bar, lets call them #top, #navleft and #navtop, the header is relative to the size of the entire page (100%), the left menu is a fixed width (275px) and appears flush against the header... here comes the problem, how do I make the topnav span 100%, after the 275px taken up by the left menu?

    I for the life of me cannot get this to work, I'm sure it's very simple for all you css guru's out there, but any help would be greatly appreciated!

    Hope this all makes sense!



    Al
    .NET Code Monkey

  2. #2
    Caveat surfer Buddy Bradley's Avatar
    Join Date
    May 2003
    Location
    Cambridge, UK
    Posts
    2,366
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    By default a block level element will take up 100% of the available width of the page, so to make your topnav take up 100% but with 275px space on the left to make room for the sidebar, just give it a left-margin of 275px, and float: left the sidebar (the sidebar will have to come before the nav in the source code for that to work).

  3. #3
    SitePoint Wizard big_al's Avatar
    Join Date
    May 2000
    Location
    Victoria, Australia
    Posts
    1,661
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Bradley!
    .NET Code Monkey

  4. #4
    SitePoint Enthusiast
    Join Date
    Sep 2005
    Posts
    44
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Does this work in IE6 and Firefox for you, big_al?

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,787
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Does this work in IE6 and Firefox for you, big_al?
    It will work virtually everywhere if done properly (apart from some float bugs that may need fixing - see faq if necessary)


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
  •