Salve, ho un sub menu sul mio sito, ma non riesco ad allineare i loghetti in verticale, qualcuno che lo sappia fare?
ps i loghetti sono "quadratolite.png"
codice HTML:
<div id="id_prodotti_div" class="medium-3 small-3 columns">
<a id="id_prodotti" href="/prodotti.asp" class="button link_interno">
<img src="/img/quadratolite.png" style="margin-right:10px;">
<%if (session("lingua") ="it") then%>PRODOTTI <%end if%>
<%if (session("lingua") ="en") then%>PRODUCTS <%end if%>
<%if (session("lingua") ="de") then%>PRODUKTE <%end if%>
<%if (session("lingua") ="ru") then%>ПРОДУКТЫ <%end if%>
<%if (session("lingua") ="es") then%>PRODUCTOS<%end if%></a>
<div id="sub-menu" class="sub-menu text-align center">
<a class="sub-item button link_interno" id="id_tavoli" href="/prodotti/tavoli.asp">
<img id="logo" src="/img/quadratolite.png" style="margin-right:10px;">
<%if (session("lingua") ="it") then%>TAVOLI <%end if%>
<%if (session("lingua") ="en") then%>TABLES <%end if%>
<%if (session("lingua") ="de") then%>TABELLEN <%end if%>
<%if (session("lingua") ="ru") then%>ТАБЛИЦЫ <%end if%>
<%if (session("lingua") ="es") then%>TABLAS <%end if%></a>
<a class="sub-item button link_interno" id="id_sedie" href="/prodotti/sedie.asp">
<img id="logo" src="/img/quadratolite.png"style="margin-right:10px;">
<%if (session("lingua") ="it") then%>SEDIE <%end if%>
<%if (session("lingua") ="en") then%>CHAIRS <%end if%>
<%if (session("lingua") ="de") then%>STÜHLEN<%end if%>
<%if (session("lingua") ="ru") then%>СТУЛЬЯ <%end if%>
<%if (session("lingua") ="es") then%>SILLAS <%end if%></a>
<a class="sub-item button link_interno" id="id_divani" href="/prodotti/divani.asp">
<img id="logo" src="/img/quadratolite.png" style="margin-right:10px;">
<%if (session("lingua") ="it") then%>DIVANI<%end if%>
<%if (session("lingua") ="en") then%>SOFA <%end if%>
<%if (session("lingua") ="de") then%>SOFA <%end if%>
<%if (session("lingua") ="ru") then%>ДИВАНЫ <%end if%>
<%if (session("lingua") ="es") then%>SOFA <%end if%></a>
<a class="sub-item button link_interno" id="id_cucine" href="/underconstruction.asp">
<img id="logo" src="/img/quadratolite.png" style="margin-right:10px;">
<%if (session("lingua") ="it") then%>CUCINE <%end if%>
<%if (session("lingua") ="en") then%>KITCHEN<%end if%>
<%if (session("lingua") ="de") then%>COOKING<%end if%>
<%if (session("lingua") ="ru") then%>КУХНИ <%end if%>
<%if (session("lingua") ="es") then%>COCINAR<%end if%></a>
</div>
</div>
codice:
div#sub-menu{
visibility: hidden;
}
div#menu div:hover div{
visibility: visible;
border-image-width: 10px;
text-align: left 10px;
}
#id_prodotti_div {
display: inline-block;
}
#id_prodotti_div a {
text-decoration: none;
}
#id_prodotti_div:hover .sub-menu{
visibility: visible;
}
.sub-menu {
visibility: hidden;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
}
.sub-item {
padding-left: 10px;
text-decoration: none;
margin-top: 10px;
display: flex;
align-items:center;
}
.sub-item img {
margin-right: 8px;
margin-left: 8px;
}