JQuery вкладки, CSS и разделительная линия

Question

Используя вкладки jQuery, содержимое двух моих вкладок разделяется следующим образом:

<div id='leftnav'>left hand menu</div>
<div id='mainbody'>Main content here</div>

Теперь, используя css, у меня есть строка в одну строку, чтобы показать, где одна останавливается, а другая начинается.

#leftnav
{
    float: left;
    width: auto;
    border-right: 1px solid gray;
    margin: 0;
    padding: 0.5em;
}

Содержание основного текста изменяется в зависимости от опции, выбранной из leftnav.Это изменяет высоту страницы, но высота линии, разделяющей их, остается неизменной.Есть ли способ сделать эту динамику как-нибудь так, чтобы она всегда была высотой основного тела?

Answer 1

Есть ли способ сделать эту динамику такой, чтобы она всегда была высотой основного тела?

Когда выбрана вкладка, вы можете запустить что-то подобное:

$('#leftnav').height($('#mainbody').height());

Answer 2

вам нужно будет установить высоту #leftnav в высоту #mainbody или задать вместо #mainbody ту же границу, что и border-left

Answer 3

может быть, вы можете добавить height:100%; к CSS.Ты пробовал это?