border right style не распространяется на аккордеон

Question

Я создал html-страницу с аккордеоном в одном div и меню в другом элементе div. ДИВО меню имеет простую границу стиль по праву элемента с помощью

height:100%; 
border-right-width:2px; 
border-right-style:solid; 
border-right-color:#4875B4; 

Это все работает хорошо, однако, всякий раз, когда я расширить заголовок аккордеона граница не расширяется и (я думал, что это будет, как высота устанавливается до 100%). Я не могу использовать стиль границы для аккордеона в коде, который я использую. Я скрываю его как значение по умолчанию.

http://jsfiddle.net/ZxnAd/ JSFiddle Пожалуйста, выберите "раздел 3", чтобы увидеть границы не простирающийся с гармошкой

Answer 1

Я надеюсь, что вы имеете в виду это с вопросом:

заменить ваш CSS с:

.accordion { 
position:absolute; 
color: #AAA; 
//title-background:black; 
top:0; 
left:195px; 
padding: 0px; 
width:100%; 
} 

Он делает границу 100% от деления справа

Граница вокруг меня НУК:

#menus{ 
position:absolute; 
top:2px; 
left:0; 
width:190px; 
height:100%; 
border-style:solid; 
border-right-width:2px; 
border-right-style:solid; 
border-right-color:#119900; 

} 

Answer 2

Есть два пути решения вашей проблемы

Первый

Удалите right border из #menus и применить left border к div.accordion

как

.accordion {border-left:2px solid #F00;} 

Fiddlehttp://jsfiddle.net/ZxnAd/14/

Второй

С помощью js вы должны найти height в accordion и применить это height к div#menus на click event из accordion div как,

$('div#menus').height($('div.accordion').height()); 

Но это будет создавать проблемы, может быть, вы должны изменить свой HTML структуру

Так что, я думаю, что это first onegood для вас.