CODEWITHSUNDEEP
csshtmlposition
JeffVader
JeffVader

Reputation: 702

Position DIV 25px from top of page?

I have a div that is created as :

<div class="test" style="width:600px; margin:0 auto;"></div>

it's horizontal position is fine, but I want to drop is 25px (possibly more) from the top of the page.

I've tried adding top:25px; to the style and adding the test class css but it hasn't helped.

div.test{
    color:black; 
    text-align:center; 
    border-radius:5px; 
    -moz-border-radius:5px; 
    border:1px solid #FFF; 
    background-color:#434987; 
}

I do have another div on the page that is using position:absolute; and I can put that where I want... but I can't get that to work with this div when I'm using margin:0 auto to align it centrally horizontally..

Can anyone offer some advice how I do this ? Thanks

Upvotes: 1

Views: 495

Answers (1)

Brett Gregson
Brett Gregson

Reputation: 5923

You can apply multiple margin CSS rules:

margin: 0 auto; margin-top: 25px

top (left, right and bottom as well) only work on certain positioned elements (absolute, fixed, static). Here is a good video about CSS positioning

Working example: http://jsfiddle.net/ZFpRN/

Upvotes: 3

Related Questions