Q
Q
quex2014-06-17 18:17:17
css
quex, 2014-06-17 18:17:17

Is using display: table evil?

I am laying out a rubber grid, in some places it is necessary to set the columns to a fixed width (for example, 2 columns: sidebar 300px, the rest of the space is the second column).

.row {
  display:table;
  width:100%;
}
.col {
     display:table-cell;
}

Cope with a bang, separately just set the width of the desired block and everything stretches perfectly and when compressed in width, nothing goes anywhere.
Manuals with the classic float are everywhere on the net. Why is the above method practically not used anywhere? What's the catch? Is it only the inoperability of this method in IE<8?

Answer the question

In order to leave comments, you need to log in

3 answer(s)
S
stas, 2014-06-19
@quex

Because there is a lot of old information on the net, rewritten and reposted 100,500 times.
In short, and we discard flex's:
There is a float - it copes with a bang, you just need to remember to clear it.
There is an inline-block - it's fine, as long as you don't face the problem of indents between columns (spaces between blocks) - you have to reset the font-size of the row + display table for safari to hang on it, and then declare the font-size child col elements (although there are other ways, but this one is optimal).
And you can just make up with warm lamp "tables", only humanly, on display table, table-row, table-cell. The nuances are the nuances of the tables, unfortunately I won’t tell you more, in fact I didn’t really get involved in the tables myself, I don’t know all the nuances.
Try each, read, get acquainted and choose the one that suits you best.

S
Sergey, 2014-06-17
Protko @Fesor

If support for older versions of browsers is not embarrassing, then why not flex-box right away ?

V
Vitaly Zheltyakov, 2014-06-17
@VitaZheltyakov

The catch is that you are laying out the table with divs.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question