CODEWITHSUNDEEP
htmlcss
Victor Marchuk
Victor Marchuk

Reputation: 13886

display: table-cell; outside the table

Is it correct to use display: table-cell; outside a table or a div with display: table? For example, like this: http://jsfiddle.net/Lnpax/

Upvotes: 2

Views: 1528

Answers (2)

thirtydot
thirtydot

Reputation: 228162

Is it correct to use display: table-cell; outside a table or a div with display: table?

You can do that.

Any of the required but missing elements will be automatically generated as "anonymous" table elements.

http://www.w3.org/TR/CSS2/tables.html#anonymous-boxes

Any table element will automatically generate necessary anonymous table objects around itself, consisting of at least three nested objects corresponding to a 'table'/'inline-table' element, a 'table-row' element, and a 'table-cell' element. Missing elements generate anonymous objects (e.g., anonymous boxes in visual table layout) according to the [rules described in the link above].

Upvotes: 3

Kypros
Kypros

Reputation: 2986

There is no problem in using it but you could have the same result be using it like this

#number-one {
    border: 1px solid;
    display: block;    // changed table-cell to block
    height: 300px;
    vertical-align: middle;
    width: 300px;
}

#number-two {
    background-color: red;
    height: 100px;
    margin: 100px;    // add margins to 'push' the inside div to the position we want
    width: 100px;
}

Upvotes: -1

Related Questions