css - Vertical centring image with display table-cell not working -


im trying vertically centre image using css display table-cell. why code not working? looks should according css-tricks.css

http://css-tricks.com/centering-in-the-unknown/

http://jsfiddle.net/sne4y/1/

.cont {     background-color: grey;     position: fixed;     height: 100%;     width: 100%;     display: table; } img {        display: table-cell;     vertical-align: middle; } <div class="cont">     <img src="http://www.quarktet.com/icon-small.jpg" /> </div> 

the img tag doesn't need display: table-cell; , vertical-align: middle; parent does.

so need:

.cont {     background-color: grey;     position: fixed;     height: 100%;     width: 100%;     display: table-cell;     vertical-align: middle; } img {  } <div class="cont">     <img src="http://www.quarktet.com/icon-small.jpg" /> </div> 

also, appears position: fixed giving problems, well, , had remove work here: http://jsfiddle.net/sne4y/6/

if still need position: fixed; (i'm assuming do) perhaps need parent div, depends on how want designed.


Comments

Popular posts from this blog

plot - Remove Objects from Legend When You Have Also Used Fit, Matlab -

java - Why does my date parsing return a weird date? -

Need help in packaging app using TideSDK on Windows -