html - margin-top not working with margin: 0 auto -


i have relative positioned div want horizontal center. want @ height in middle of page. css below, put in middle horizontally not apply margin-top it

  position:relative;   margin: 0 auto;   text-align:center;   color:white;   opacity:0.75;   margin-top:30px; 

what wrong??

give whirl ;)

css:

.info { width: 300px; height: 40px; position:absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; text-align:center; color:white; opacity:0.75; background-color: #000; /*-- specify liking on background color --*/ line-height: 40px; vertical-align: middle; } 

html:

<div>     <div class="inner">post text here</div> </div> 

is seeking? here jsfiddle: http://jsfiddle.net/s5py5/7/

update:

updated demo


Comments

Popular posts from this blog

Detect support for Shoutcast ICY MP3 without navigator.userAgent in Firefox? -

web - SVG not rendering properly in Firefox -

java - JavaFX 2 slider labelFormatter not being used -