html - Vertical alignment of the image within a DIV tag -



html - Vertical alignment of the image within a DIV tag -

i have been playing around div tag sometime , tried doing rounded corner div tag

<div id="y" style="border: 3px solid #000000;background: #b4ef05; border-radius: 25px;width: 300px; height:200px;"> <div id="ds"style="width:100%; height:80%;border-top-left-radius: 2em;border-top-right-radius:2em; background: #b4ef05;"><span> <img style="display: block; margin:auto;border: 0 none; position: absolute;left:40px;top:30px;" src="http://www.urbanfonts.com/images/cache/fontnames/1f99582aeadde4d87491dd323d5f01db_auto_362_97.jpg"> </span></div> <div id="dscs"style="border-bottom-left-radius: 1em;border-bottom-right-radius:1em;width:100%;height:20%;background: #000000;color:#ffffff;"><span style="padding:35px;">sssd</span></div> </div>

but not able set image alignment properly, vertical-align:middle; doesn't work. need image come middle of div automatically deciding left , top. approach right split div element 2 store 2 different values?

it's not utilize inline style in html elements :)

html

<img class="imglackey" src="http://www.urbanfonts.com/images/cache/fontnames/1f99582aeadde4d87491dd323d5f01db_auto_362_97.jpg">

css

.imglackey{ display: table-cell; border: 0 none; margin: 0 auto; } #imgcont{ display: table-cell; vertical-align: middle; } #ds{ display:table; }

fiddle

html css alignment

Comments

Popular posts from this blog

php - Android app custom user registration and login with cookie using facebook sdk -

django - Access session in user model .save() -

php - .htaccess Multiple Rewrite Rules / Prioritizing -