Вот для такого примера хотелось бы, чтоб все табы по высоте занимали все доступное место на странице, табы будут динамически добавляться. Есть ли какое-нибудь простое и элегантное решение?
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/hot-sneaks/jquery-ui.css">
</head>
<body>
<script> $(function() { $( "#tabs" ).tabs(); }); </script>
<div id="tabs">
<ul>
<li><a href="#tab-1">TAB 1</a></li>
<li><a href="#tab-2">TAB 2</a></li>
</ul>
<div id="tab-1" style="padding: 2px;">
<script> $(function() { $( "#subtabs" ).tabs(); }); </script>
<div id="subtabs">
<ul>
<li><a href="#subtab-1">TAB 1</a></li>
<li><a href="#subtab-2">TAB 2</a></li>
</ul>
<div id="subtab-1">
</div>
<div id="subtab-2">
</div>
</div>
<div id="tab-2">
</div>
</div>
</body>
