Я пытаюсь поставить подменят прямо под его собственный выбор варианта как this, но когда я установил левый и правые атрибуты на 0
Вертикального подменят с дивами
.sidebar_wrapper
{
position:absolute;
background-color:lightgray;
left:0;
right:0;
}
имеет ширину целого сайта. Когда я устанавливаю их на авто, он выглядит как this.
Как разместить свое подменю точно под этим div или, что будет выглядеть еще круче, на самом деле?
код (весь JSFiddle в комментариях):
HTML:
<div id="sidebar">
<div class="sidebar_option">Strona główna</div>
<div class="sidebar_option">Galeria</div>
<div class="sidebar_option">Reżyserzy
<div class="sidebar_wrapper">
<a href="tarantino.html"><div class="submenu" style="margin-top:10px">Quentin Tarantino</div></a>
<a href="coen.html"><div class="submenu">Bracia Coen</div></a>
<a href="anderson.html"><div class="submenu">Wes Anderson</div></a>
</div>
</div>
<div class="sidebar_option">Ulubione filmy</div>
<div class="sidebar_option">Seriale</div>
<div class="sidebar_option">Kontakt</div>
</div>
CSS:
.submenu
{
text-align:center;
border-bottom:dotted 2px black;
padding-top:10px;
padding-bottom:10px;
display:none;
font-size:13px;
}
.sidebar_wrapper
{
position:absolute;
background-color:lightgray;
left:auto;
right:auto;
}
.sidebar_option:hover div
{
display:block;
}
.sidebar_option:hover
{
background-color:lightgray;
cursor:pointer;
}
.sidebar_option
{
text-align:center;
margin:10px;
padding:10px;
border-bottom:dotted 2px black;
}
https://jsfiddle.net/8d3p50hy/ –