Растянуть сайдбар по вертикали

height="100%"

Не работает? Тогда надо весь код смотреть

вот код:

<div id="sidebar">

<ul>

  <?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(__('Left Sidebar','wp_multiflex')) ) : else : ?>

  <li><h2 align="center">

    <?php _e('Категории','wp_multiflex'); ?>

  </h2>

<ul>

<?php wp_list_categories('orderby=order&title_li='); ?>

</ul>

</li>

<?php endif; ?>

</ul>

</div>

И стиль:

#sidebar {

	width: 199px;

	padding: 0 0 10px 0;

	margin: 0;

	background-image: url(images/l_sidebar.jpg);

	background-repeat: repeat-y;

}

#sidebar ul {

	margin: 0;

	padding: 0;

	min-height: 100%;

	padding-bottom: 10px;

}

#sidebar li {

	list-style: none;

}

#sidebar h2.pages {

	color: #DE0000;

	background-image: url(images/bg_corner_topright.gif);

	background-position: top right;

	background-repeat: no-repeat;

	margin: 0 0 10px 0;

	padding: 5px 0 5px 20px;

}

#sidebar li h2 {

	color: #CC0000;

	font-size: 1.4em;

	margin: 0 0 5px 0;

	padding: 10px 0 12px 20px;

	font-style: normal;

	font-weight: bolder;

	text-decoration: none;

	text-align: left;

	background-image: url(images/L.jpg);

}

#sidebar a {

	font-size: 1.1em;

	color: #000099;

	font-weight: bold;

	text-decoration: none;

}

#sidebar li li {

	padding: 0;

	margin: 0 0 0 20px;

}

#sidebar  li li a {

	background: url(images/bg_bullet_full_1.gif) left no-repeat;

	padding-left: 10px;

	line-height: 20px;

}

#sidebar li li a:hover {

	background: url(images/bg_bullet_full_2.gif) no-repeat left;

	color: #FF0033;

	text-decoration: underline;

}

#sidebar li li li {

	padding: 0;

	margin: 0 0 0 10px;	

}

#sidebar li li li a {

	background: url(images/bg_bullet_half_1.gif) left no-repeat;

	padding-left: 10px;

	line-height: 20px;

}

#sidebar li li li a:hover {

	background: url(images/bg_bullet_half_2.gif) left no-repeat;

	color: #FF0033;

	text-decoration: underline;

}

#sidebar li.recentcomments {

	padding: 2px 0 2px 0;

	margin: 0 10px 0 10px;

	font-size: 1em;

	border-bottom: 1px solid #89AAD6;

}

#sidebar li.recentcomments a {

	font-size: 1em;

	background-image: none;

}

#sidebar li#recentposts ul li.recentposts a {

	padding: 0;

	margin: 0;

	background-image: none;

	font-size: 0.95em;

} 

#sidebar li#recentposts ul li.recentposts {

	border-bottom: 1px solid #89AAD6;

	margin: 0 10px 0 10px;

	padding: 2px 0 2px 0;

}

#sidebar div.textwidget {

	padding: 2px 10px 2px 10px;

	margin: 0;

}

#sidebar div.textwidget p {

	font-size: 1em;

	padding: 0;

	margin: 0; 

}

#sidebar div#calendar_wrap {

	text-align: center;

	margin: 0;

	padding: 0 0 0 15px;

}

#sidebar #wp-calendar {

	text-align: center;

}

#sidebar #wp-calendar a {

	text-decoration: none;

}

#sidebar td {

	font-size: 0.9em;

	border: 1px solid #89AAD6;

	padding: 3px;

	background-color: #ffffff;

}

#sidebar td.pad {

	border: none;

	background: transparent;

}

#sidebar td#prev, #sidebar td#next {

	border: none;	

	background: transparent;

}

#sidebar #today {

	background-color: #ffff99;

Ты лучше HTML на выходе скинь

Вот, что на выходе:

<link href="style.css" rel="stylesheet" type="text/css" />



<style type="text/css">



<!--



a:link {



	color: #003366;

}



a:visited {

	color: #999999;

}

a:hover {

	color: #FFA6BD;

}

a:active {

	color: #FF00FF;

}



-->



</style><div id="sidebar">



<ul type="disc">

    <li>

     </li>

  <li>

       <ul>

    

        	<li class="cat-item cat-item-3"><a href="http://vid68.ru/?cat=3" title="Просмотреть все записи в рубрике 1">1</a>

</li>

	<li class="cat-item cat-item-4"><a href="http://vid68.ru/?cat=4" title="Просмотреть все записи в рубрике 2">2</a>

</li>

	<li class="cat-item cat-item-11"><a href="http://vid68.ru/?cat=11" title="Просмотреть все записи в рубрике n">n</a>

</li>

</li>

   </ul>

   </ul>



</li>

Лично у меня всё воркает если в стилях прописать #sidebar{height:100%}

неучи.

height:100% работает только при верстке в режиме совместимости

если стоит DOCTYPE то забудьте про это свойство

Вообще для таких целей надо либо сайдбар и область контента засовывать в строку таблицы, либо <div style='display:table-cell'> со всеми вытекающими. Тогда у них будет одна высота а футер снизу сам прилипнет

Тогда скинь всю страничку с доктайпом и т.п.

dma84 добавил 04.06.2009 в 14:23

http://www.cssplay.co.uk/layouts/three-column-layouts

Вот здесь посмотри, там как раз реализована 100% высота у колонок, но сами блоки, не имеют 100% высоту, это реализовано посредством подложки нужного фона под блок. Попробуй разобраться сам, объяснять - язык сломаешь.

Спасиба, попробую разобраться на этих примерах.

Вопрос актуален