Как использовать переполнение: скрыто только на последнем дт дл

Question

Я не уверен, есть ли (n простое) решение, но проблема выглядит так:

У меня есть довольно простой Аккордеон, построенный с помощью dl;

<dl>
<dt>MenueLink1</dt>
<dd>Content1</dd>
<dt>MenueLink2</dt>
<dd>Content2</dd>
.
.
.
<dt>Logo</dt>
</dl>

Последний пункт содержит логотип. И вот совок: я хочу использовать переполнение: скрыто только для последнего dt, содержащего логотип. Поэтому, если логотип перемещается за пределы браузера / экрана (в результате разной высоты Content-DD), я не хочу, чтобы браузер отображал полосу прокрутки, но как только другой dd или dt покидает экран / браузер, полоса прокрутки должна появиться. Моей первой идеей было поместить логотип в отдельный div вне dl, но затем он не двигался вверх и вниз с остальной частью dl при изменении высоты ...

Я был бы очень рад, если бы кто-нибудь дал мне подсказку или решение.

Answer 1

Зависит от того, какие браузеры вам нужно поддерживать.Селектор dl dt:last-child будет работать для вас , если выбранные вами браузеры его поддерживают .

В противном случае обычной практикой является присвоение класса last-item последнему dt, когда выгенерируют HTML и используют dl dt.last-item, что, конечно, универсально поддерживается.