CODEWITHSUNDEEP
htmlcsscss-float
Simon
Simon

Reputation: 2035

DIV center align

I have div, which has all content aligned to center:

<div align="center">
   <table><tr><td>.....

But align is not more valid attribute. So, i have changed to class or style:

<div style="text-align:center;">

But it is not the same as before. Table is now aligned to left and not to center. Obvious text-align is not equivalent to old center attribute. How should i write style to achieve the same functionality as before with center attribute?

Upvotes: 4

Views: 485

Answers (6)

Brenex
Brenex

Reputation: 111

Perhaps take a look here?

I've used that several times to vertically center content.

Then take a look at bootstrap. They have mix-ins that take care of the horizontal alignment (here).

Edit:

@mattytommo has a good answer for the horizontal alignment.

Upvotes: 1

sengar19
sengar19

Reputation: 45

To align the table to center of the parent element of the table, just use:

table {
 margin: 0 auto;
}

Also to align the table to center in respect of height of the parent element of table, you can give line-height same as height of the parent element.

Upvotes: 2

Matt
Matt

Reputation: 15061

As mentioned above in the comment you need to align the table

Add this to your CSS:

table.center {
              margin-left:auto; 
              margin-right:auto;
             }

And then add this to your table:

<table class="center">
...
</table>

Upvotes: 1

Mukul Kant
Mukul Kant

Reputation: 7122

You can try this:-

div{
   width:90%;
   margin:0 auto;
   text-align:center;
}

or

<div style="width:90%;margin:0 auto;text-align:center">
   <table>
       <thead>
           <tr>
               <th>header</th>
           </tr>
       </thead>
       <tbody>
           <tr>
               <td>data</td>
           </tr>
       </tbody>
   </table>
</div

Upvotes: 0

Vineet Mishra
Vineet Mishra

Reputation: 100

If you want to align table to center, use the following

<table align="center">

This will align your table to centre of div.

Upvotes: 0

Mathew Thompson
Mathew Thompson

Reputation: 56429

Just use margin: 0 auto on your table to center it.

See HERE

Upvotes: 3

Related Questions