The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Exhausting my limited CSS abilities Re: Exhausting my limited CSS abilities

Rob MacKay

Obviously Ikthius is right there.

You are using padding to position the text – never ever ever ever ever ever ever (etc…) use padding or margins to position elements, it always renders wrong.

For example

#content {
background-image: url(../images/content.png);
background: #dee9e9;
border: none;
height: 526px;
width: 756px:
padding-top: 0px;
padding-left: 280px;
padding-right: 50px;

overflow: auto;
background-repeat: no-repeat;

Dont do that – What you should think about doing is keep your content div and create another div that comes after your "latest news" div. Float the latest news and the new div left, then put all your text content in the new div.

Have a look through your document and everytime you use margin or padding to physically move text or objects to a specific point in the page, remove and replace with

#myexampleitem {


The position attribute is how you should always position items.

If you set the position of your wrapper div to relative, any element you postion inside it will reference its position to the wrapper. If you dont give the wrapper a position, when you set the position to your elements they will be relative to your browser window, and not relative to the div they are contained in.

Positioning can be a little strange at first, but its the only way to place elements successfuly.