[RESOLVED] Placing divs over each other
I'm building a new webdesign and I need to place one div above the other one.
I don't do a lot of HTML stuff lately so I'm a bit out of the game.
Since HTML 5 and CSS 3 I didn't do anything with something like this.
On the internet I read the position element is no longer recommended by CSS 3 so I was wondering: is there a good way in CSS 3 to do this without using the position element? Or do you guys still recommend me to fix it by using the position element?
Thanks in advance,
I don't know what you read that made you think that the 'position' property was no longer recommended, but it's simply not true. It is a fundamental CSS property.
Right. I don't know where I've got it from but thanks for the info.
Since the topic name is still relevant I'd like to ask another question about the same subject.
I need to place a menu div like "halfway" over the content div. As soon as I use position relative or absolute the div moves to the top left corner.
Since I need the div to be in a position based on the content div, is there a way to do this properly? I guess if I position the div correctly on my screen it will not be on the same position on a computer where they use another resolution? True or false?
It's not practical to try to teach you how absolute positioning works here in the forum. It's not that its so terribly complicated, but it does require a basic understanding of how elements are created and positioned in a document. So, rather than try to cram everything into a message on the fly here, I'd suggest that you search on "CSS positioning tutorial". That way you'll find well-thought out instructions that will give you a good foundation and build naturally toward what you're trying to achieve. Absolute positioning is a very useful capability and worth the time and effort to learn how to use it. Good luck!
Thanks. I was hoping someone could tell me how to get a div positioned on basis of the parent div.
I will definitely try the links and some tutorials and I'm sure I should be able to figure it out. Thanks for the suggestions!
Are we talking about...<div id="menu" style="position:absolute; z-index:2; Top:300px; left:300px;"></div> ?
I can't remember if position:relative works with z-index or not (it's been a while), but if it does, there's putting both divs in a wrapper div (which would then become the parent div of both divs, using position:relative on the 'menu' div and using negative margins to "drag" the menu div over-top of what you're calling presently calling the parent div.
It has been resolved but thanks for the input.
Position relative was enough. I was able to put the div in another place from there with the top and left properties.
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)