Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    New to the CF scene
    Join Date
    Jul 2005
    Thanked 0 Times in 0 Posts

    Review my CSS Layout -- needs tweaking

    This is my first all CSS layout and I wanted to post it for review and especially suggestions on how to make it better.


    And I also created a .jpg that shows a graphical representation of the layout, has all the divs labeled, and shows the width, height, and attributes that I was going for. You can find that image here

    I can tell you that I am already having the following problems:

    1. In Firefox, #HeaderRight is being cut off on it's left side so the border-left is not displaying. I also noticed that #Sidebar is doing the same. I know it has something to do with the left floats that is next to each, but I am unsure how to get the layout I want and ensure those don't get cut off.

    2. I also would like #HeaderRight and #SideBar to expand vertically with #HeaderLeft and #Content respectively (Just like tables would). I remember reading once that there is some sort of a trick if you use a background image, but I couldn't find that again.

    3. Right now in Firefox, #SideBar is appearing below #Content and all the way to the right. It's in the right position, it's just not next to #Content the way I intended it to be.

    I think those are the main issues. If anyone could please help me clean this up to ensure it worked properly, and let me know if there are any compatibility issues, I would very much appreciate it.


    Edit: I think problem #3 might only appear once I add content. #SideBar appears in the correct place in the link I sent above (in IE6 and Firefox, atleast)

    Also, everything seems to line up nicely when I don't define a float for #SideBar and rather only use a float for #Content, however, I do still need them to stretch to the other's height and fix the issue with #SideBar and #HeaderRight being cut off on their left sides.
    Last edited by dgmax; 07-08-2005 at 07:21 PM.


Posting Permissions

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