- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hi everybody,
I am trying to design a nice layout for my site, but I am having some problems with the css. Basically I want the sidebar to be on top of the main content (centered) and the header (full width). In other words I want to have something similar to this:
http://uselessgeek.com/youjiii/tests/z-index_tests.png
But I only manage to get this:
http://uselessgeek.com/youjiii/tests/z-index_tests.html
Here is the html/css (that I put in the same file for the sake of testing)
Does anybody have any hints or ideas on how I could achieve this (in the cleanest way possible) please?
EDIT: I can’t use absolute positionning because if I do the sidebar won’t move if I resize the window size. So on big screens since the main content is always centered, the sidebar will end up on top of it. Same problem if I want to make the layout liquid (or elastic for that matter).
That’s why I was trying to solve the problem with z-index…
I might be missing something obvious but i cant see any differance bettween the image and what you already have…
Yeah I’m sorry, I actually found the solution and fixed the problem. What I had to do is set the page-wrap to position: relative and then position the sidebar absolutely. In the beginning I was just floating it and using z-index which didn’t work at all..
Here is the new code, Problem solved ;)
Congrats..