...

View Full Version : Container Positioning



Buz
08-04-2007, 09:26 PM
Right, I'm new to CSS and had a small question regarding the positioning stuff. If I make a container and position it as Absolute, and lets say 30px from the left, would it show up 30px from the left on a bigger monitor< Meaning a larger explorer screen. This is the code I have currently:


.latestnews{
position: absolute;
left: 5px;
top: 170px;
background-color: #ececec;
padding: 10px;
width: 600px
}

Also, when I do that, it kind of puts my footer off, since all the content is now in a <div> so I have to manually position the header downwards. Any suggestions on how to fix that?

dancrew32
08-04-2007, 09:40 PM
yes it should show up 30px from the left no matter what...(make sure you do a css reset first - *{margin:0;padding:0;})

a better way to do absolute positioning is to define a relative positioned box, then define absolute items within it. that way it will not effect the rest of the page's positioning.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>|</title>
<style>
.news{
position:relative;
height:200px
width:600px;
}
.latestnews{
position: absolute;
left: 5px;
top: 170px;
background-color: #ececec;
padding: 10px;
width: 600px
}

</style>
</head>
<body>
<div class="news">
<div class="latestnews">testtestetsteslorum ismpump</div>
</div>
</body>
</html>

Buz
08-04-2007, 09:49 PM
That's exactly what I was about to do mate, glad to know I'm on the right track :D

Cheers mate, thanks alot.

~Buz

EDIT: Any suggestions for the header. I'm quite annoyed by setting it manually everytime I add more news to the page.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum