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
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="js/jquery-1.10.2.js"></script> <script src="js/jquery-ui.js"></script> <link rel="stylesheet" href="css/jquery-ui.css"> </head> <style> .entity { background: #f2f2f2; width: 200px; height: 380px; border-radius: 5%; border: 3px solid black; } .title { text-align: center; vertical-align: middle; padding-top: 10px; border-bottom-style: solid; border-bottom-width: 3px; padding-bottom: 10px; } .title_box { text-align: center; vertical-align: middle; padding-top: 1px; border-top-style: solid; border-top-width: 1px; border-bottom-style: solid; border-bottom-width: 1px; padding-bottom: 1px; } .cancel { position: absolute; right: 5px; top: 5px; } .box { height: 100%; } .filter { text-align: center; vertical-align: middle; padding-top: 10px; padding-bottom: 10px; } .columns { height: 100px; overflow: auto; padding: 5px 5px 5px 5px; } .box_filters { height: 100%; } .filters { height: 100px; overflow: auto; padding: 5px 5px 5px 5px; } </style> <script> $( document ).ready(function() { $(".box_filters").resizable( { minHeight: 380, minWidth: 200 } ); }); </script> <body> <div id="container"> <div class="entity"> <div class="title">Zákazník</div> <div class="cancel">x</div> <div class="box"> <div class="filter">Filtrovat</div> <div class="box_menu"> <div class="box_columns"> <div class="title_box">Sloupce</div> <div class="columns"> <p>a</p> <p>b</p> <p>c</p> <p>a</p> <p>b</p> <p>c</p> <p>a</p> <p>b</p> <p>c</p> </div> </div> <div class="box_filters"> <div class="title_box">Filtry</div> <div class="filters"> <p>a</p> <p>b</p> <p>c</p> <p>a</p> <p>b</p> <p>c</p> <p>a</p> <p>b</p> <p>c</p> </div> </div> </div> </div> </div> </div> </body> </html>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>