Всем привет, сегодня столкнулся с такой проблемой:
У меня есть сайт, делал его другой человек с которым связи нет.
Момент такой, я немножко понимаю в HTML , и добавил пункты меню в блоки.
Но получилось вот такое:
То есть по идее оно должно было раскрыться и доп пункты которые я положил в submenu уйти вниз как вот здесь:
Код:
<div class="mainCatalogBlock oils"><span class="mainCatalogBlockName">Масла</span>
<ul class="mainCatalogBlockOption">
<a href="/oils_catalog">
<li>Моторные (ДВС)</li>
</a>
<a href="/gear_oils_catalog">
<li>Трансмиссионные</li>
</a>
<a href="/industrial_gear_oils_catalog">
<li>Индустриальные</li>
</a>
<a href="/moto_boat_oils_catalog">
<li>Масла для мотоциклов и лодок</li>
</a>
</ul>
<ul class="submenu">
<a href="/flushing_oils_catalog">
<li>Промывочные</li>
</a>
<a href="/hydraulic_oil_catalog">
<li>Гидравлические</li>
</a>
</ul>
</div>
CSS
.mainCatalogBlockOption {
list-style-type: none;
width: 10px;
font-size: 20px;
font-weight: bold;
font-family: Montserrat Black, Arial, sans-serif;
margin-left: -40px;
}
.mainCatalogBlockOption li {
text-decoration: none;
line-height: 30px;
font-size: 16px;
white-space: nowrap;
}
И вот Submenu
.mainCatalogBlock .submenu {
position: absolute;
z-index: 10;
list-style: none;
display: none;
width: 100%;
height: auto;
top: calc(100% - 40px);
left: 0;
background: linear-gradient(transparent 20px, white 20px, white);
box-shadow: 0 15px 15px #dadada;
padding: 0 0 10px;
}
.mainCatalogBlock .submenu li {
padding: 4px 20px;
}
