How to align a div inside td element using CSS class

It is working with this way

<td align="center">

But I want to use CSS class.

I defined class like this way but no luck

td
{
    vertical-align: middle;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    align: center;
}

Vertical align is working and text align is working for text. But it does not align div inside td with this way. I want to align div inside td.


Solution 1:

div { margin: auto; }

This will center your div.

Div by itself is a blockelement. Therefor you need to define the style to the div how to behave.

Solution 2:

I cannot help you much without a small (possibly reduced) snippit of the problem. If the problem is what I think it is then it's because a div by default takes up 100% width, and as such cannot be aligned.

What you may be after is to align the inline elements inside the div (such as text) with text-align:center; otherwise you may consider setting the div to display:inline-block;

If you do go down the inline-block route then you may have to consider my favorite IE hack.

width:100px;
display:inline-block;
zoom:1; //IE only
*display:inline; //IE only

Happy Coding :)