css position question
- Started
- Last post
- 5 Responses
- to
i am a little bit irritated about follwing...
if i do this:<code>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>untitled</title>
<style type="text/css">
* {padding: 0px; margin: 0px;}
.styleclash {width: 200px; height: 200px; border: 1px solid red; }
#wrapper {width: 800px; height: 100%; border: 1px solid black;}
</style></head>
<body>
<div id="wrapper">
<div id="header" class="styleclash">header</div>
<div id="content" class="styleclash" style="position: absolute; top: 850px; left:50px;">content</div>
<div id="footer" class="styleclash">footer</div>
</div>
</body>
</html>
</code>is it right, that the content box jumps out of my wrapper-div? or should it be within the wrapper?
- graham0
it will do if you're using absolute positioning
- jamble0
It's doing what you've told it to and that's appear 850px from the top of the containing div.
Add a position:relative to your wrapper and change the 850px to 0 and it will appear inside the wrapper.
- ian0
Yeah, absolute positioning is relative to the browser, not the wrapper div.
- to0
wow, thank you so much...
:D
- Stugoo0
or you can set the parent div of the absolute one to
position:relative;
to make it attach to that.