Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
07-08-2005, 06:46 PM #1
- 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.