Question

This is my code :

<div class="container">
    <a class="link" href="http://www.website.com">My Link</a>
</div>

.container
{
    width:400px; 
    text-align:center;
}

.link
{
    background-color:red;
    font-size:14px;
}

I don’t want to use inline block (because IE7 doesnt support it).
And I don’t want to use margin/padding left to my div container to center it, setting block to the link.

Is there any way to make a fixed height for this kind of situation? Line-height doesnt get background-color, and my font-size must be 14px.

Answer 1

inline-block support with the * hack. write like this:

.link
{
    background-color:red;
    font-size:14px;
    display:inline-block;
    *display:inline;/* For IE7*/
   *zoom:1;/* For IE7*/
   vertical-align:top;

}