Div как таблица
Автор Мария Вавилова задал вопрос в разделе Другие языки и технологии
Как сделать таблицу с помощью div'ов и получил лучший ответ
Ответ от Ёигизмунд Таврический[гуру]
<style type="text/css">
body {
margin: 0;
padding: 50px;
background-color: #FFFFFF;
color: #000000;
font-family: Arial, Helvetica, sans-serif;
}
.tablewrapper {
position: relative;
}
.table {
display: table;
}
.row {
display: table-row;
}
.cell {
display: table-cell;
border: 1px solid red;
padding: 1em;
}
.cell.empty
{
border: none;
width: 100px;
}
.cell.rowspanned {
position: absolute;
top: 0;
bottom: 0;
width: 100px;
}
</style>
<div class="tablewrapper">
<div class="table">
<div class="row">
<div class="cell">
Top left
</div>
<div class="rowspanned cell">
Center
</div>
<div class="cell">
Top right
</div>
</div>
<div class="row">
<div class="cell">
Bottom left
</div>
<div class="empty cell"></div>
<div class="cell">
Bottom right
</div>
</div>
</div>
</div>
Источник:
html: <div id="wrapp"><div id="row1">Ячейка 1</div><div id="right"><div class="rows2">Ячейка 2</div><div class="rows3">Ячейка 3</div></div></div>css: #wrapp{height: 120px;width: 300px;background: #ccc;border: 1px solid black;text-align: center;}#row1 {height: 120px;width: 140px;border: 1px solid black;float: left;line-height: 120px;}#right {height: 100%;width: 156px;border: 1px solid black;float: right;}.rows2, .rows3 {width: 156px;border-bottom: 2px solid black;height: 58px;line-height: 58px;}.rows3 {border: none;}