HTML Table

by kmouse

HTML

<div class="table">
    <div class="row">
        <div class="header">#</div>
        <div class="header">Columna</div>
        <div class="header">Relative</div>
        <div class="header">Isso</div>
    </div>
    <div class="row">
        <div style="position: absolute; display: table-cell">1 dsfdf dafdaf</div>
        <div class="cell">This</div>
        <div class="cell">Column</div>
        <div class="cell">Is</div>
    </div>
    <div class="row">
        <div class="cell">2</div>
        <div class="cell">Coloumn</div>
        <div class="cell">two</div>
        <div class="cell">this</div>
    </div>
    <div class="row">
        <div class="cell">3</div>
        <div class="cell">is</div>
        <div class="cell">not equals</div>
        <div class="cell">a</div>
    </div>
    <div class="row">
        <div class="cell">4</div>
        <div class="cell">the</div>
        <div class="cell">Column</div>
        <div class="cell">real</div>
    </div>
    <div class="row">
        <div class="cell">5</div>
        <div class="cell">first</div>
        <div class="cell">One</div>
        <div class="cell">Coloumn</div>
    </div>
</div>

CSS

.table { display: table; } 
.row {	display: table-row; }
.header { display: table-cell; font-weight: bold; }
.cell { display: table-cell; }

.header, .cell {
    padding:0.8em;
    border: 1px solid;
}
.header {
    background-color:#6699FF;
    font-weight:bold;
}