html - Vertically aligning a text element inside a parent div element? -
i trying align text inside div
. have read 4 topics here on sof , of them recommend use vertical-align
property. in case doesn't work.
.free { display: inline-block; -webkit-border-radius: 4; -moz-border-radius: 4; border-radius: 4px; font-family: 'open sans', sans-serif; color: #ff0000; background: #ffffff; border: dashed #ff0000 2px; width: 105px; height: 46px; font-size: 1.07rem; font-weight: bold; text-align: center; text-decoration: none; text-transform: uppercase; margin-bottom: 0; } .free p { vertical-align: middle; }
<div class="free"> <p>text</p> </div>
try this: demo
add following code in css
.free { line-height:46px; } .free p { background-color:#ccc; padding:0; margin:0; }
hope helps !