CODEWITHSUNDEEP
csscss-tables
user3252936
user3252936

Reputation: 27

How to center this table?

How to center this table?

I have tried margin-left: 50% and margin-right: 50% but no result.

http://jsfiddle.net/WtJxT/ [1]

Note: Table columns must keep its original sizes, not to collapse.

[1]: 

.tic {
    display : table; 
    width : 700px; 
    border:solid 7px #c9c9c9;
    height : 97%;
    position: absolute;
    margin-left: 120px;
}

Upvotes: 1

Views: 49

Answers (1)

Tarmo
Tarmo

Reputation: 4081

.tic
{
  display : table; 
  width : 700px; 
  border:solid 7px #c9c9c9;
  height : 97%;
  position: relative;
  margin: 0 auto;
}

Why this works?

As you can see I modified two attributes in your css snippet. First of all postion: relative;. Making the position relative makes the div.tic relative to it's parent container. The second attribute is margin: 0 auto;. The auto property tells the browser to set the margin so that the empty space between tic and it's outer container would be equal from both sides(left and right) and 0 sets the margin-top and margin-bottom to 0.

Upvotes: 1

Related Questions