Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<div class="tabulka"> <div class="radek"> <div class="bunka">Buňka</div> <div class="bunka">Buňka dlouhá</div> <div class="bunka">Buňka</div> <div class="bunka">Buňka</div> <div class="bunka">Buňka hodně dlouhá</div> <div class="bunka">Buňka</div> <div class="bunka">Buňka</div> </div> <div class="radek"> <div class="bunka bunka-cela-vnitrek"> <div class="bunka-cela"> Buňka dlouhá přes celý řádek </div> </div> </div> <div class="radek"> <div class="bunka">Buň</div> <div class="bunka">Buňka dlouhá</div> <div class="bunka">Buňkaaa</div> <div class="bunka">Buňkaa</div> <div class="bunka">Buňka</div> <div class="bunka">Buňkaaaaaa</div> <div class="bunka">Buňkaaaa</div> </div> <div class="radek"> <div class="bunka bunka-cela-vnitrek"> <div class="bunka-cela"> Buňka dlouhá přes celý řádek </div> </div> </div> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
* { box-sizing: border-box; } .tabulka { display: table; width: 100%; } .radek { display: table-row; width: 100%; position: relative; } .bunka { display: table-cell; border: 1px solid; padding: .2em; } .bunka-cela { position: absolute; width: 100%; top: 0; left: 0; border: 1px solid; padding: .2em; } .bunka-cela-vnitrek { border: 0; padding: auto 0; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>