Check out this example:
When dealing with fluid divs, line height won't work as expected. My current code relies on line-height which doesn't work when the box sizes change. How can I ensure that a link (content) always appears perfectly centered?
I need to guarantee that the content within this DIV is consistently centered both vertically and horizontally.
Current code: (please note that the style tag is empty as it gets populated dynamically)
<style type="text/css">
.box{
width:468px; /* sometimes changed by PHP */
height:60px; /* sometimes changed by PHP */
background:#eee;
text-align:center;
border:1px solid rgb(177, 172, 171);
line-height: 61px;
}
</style>
<div style="" class="box" id="">
<a style="color:#333;font-weight:bold" href="claimPrize();">Winner!</a>
</div>