Я работаю над проектом, этот сайт имеет гибкие значения для любого разрешения. Проблема в том, что в одном из моих div'ов есть выпадающее меню, но оно не отображается правильно (будучи обрезанным), потому что родительский div имеет переполнение, автоматически обрезает часть, находящуюся вне div.
Для div необходимо автоматическое переполнение, поскольку оно имеет рамку и отступ
основной код
div.box{
border:1px solid #ccc;
overflow:auto;
padding:10px;
}
.dd-btn{
width:22px;
height:22px;
float:left;
position:relative;
}
.dd-btn ul{
list-style:none;
width:100px;
height:200px;
position:absolute;
top:22px;
right:0;
z-index:100;
background:#000
}
.dd-btn ul li{
width:100px;
float:left;
}
<div class="box">
<ul>
<li>link</li>
<li>link</li>
<li>link</li>
</ul>
</div>
этот div не может иметь поплавок или ширину: 100% или высоту из-за структуры всего сайта. Содержание и разрешение изменится.
Есть ли простой способ решения этой проблемы?
Нашел решение:
.box:after{
clear:both;
content:" ";
display:block;
font-size:0;
height:0;
line-height:0;
visibility:hidden;
width:0;
}
с помощью этого я могу избавиться от переполнения авто, и окно будет отображаться правильно