Is It Possible To Use Td Elements Inside Div (without Table)?
I am trying to create very flexible grid, my code is approximately as
TEST &l
Solution 1:
Use a list element and set the child elements to inline..
Set list-style-type
to none to remove the bulletpoints markers.
ul{
list-style-type: none;
}
ul li{
display: inline;
}
<ul>
<li>
TEST
</li>
<li>
TEST
</li>
</ul>
Also, your div issue.. that's divs desired behaviour since a div is a block element compared to span which is an inline-block element. You should either use spans or set div to inline-block.
Solution 2:
If you want a table layout then use display:table
.grid {
display: table;
border: 1px solid;
}
.grid-row {
display: table-row;
border: 1px solid red;
}
.grid-cell {
display: table-cell;
border: 1px solid green;
}
<div class="grid">
<div class="grid-row">
<div class="grid-cell">TEST</div>
<div class="grid-cell">TEST</div>
<div class="grid-cell">TEST</div>
</div>
<div class="grid-row">
<div class="grid-cell">TEST</div>
<div class="grid-cell">TEST Test</div>
<div class="grid-cell">TEST</div>
</div>
</div>
Post a Comment for "Is It Possible To Use Td Elements Inside Div (without Table)?"