Problem with moving div

When I try to move the div #planet up (I change margin-top from -76px to -86px) my whole site "lifts up".

You can view the page here (and see the problem) http://rssreaderbg.net/pubsubbub/example/cssexam/index.php

It's because a div is a block element, so it stretches from one end to the other. So when you change the top of that particular div, you're changing the tops of all the following divs.

See the trick (an oldie but a goodie) at the bottom of this page http://css-tricks.com/the-css-box-model/ (as a for instance) to see how this works and to find out how to duplicate it for yourself.

try to add height parameter to "icons" div... when you change that margin now, size of parent div(icons) is affected and whole site moves up because that div changed height

just apply padding-top:10px; for the #container

Remove all margin of the class .iconss

Use position:absolute on #icons and set the position:relative in the class .iconss

Now, use top and left css property to set the icon position.

Cleber.

id=icons are above the id=nav. When you edit the top margin of an element in id=icons it effect id=icons. When id=icons goes up the others goes up too. I suggest you to use position css for icons and nav too.