Komu se při úpravě menu nehodí práce s výplní, může zkusit něco jiného. Třeba zvýraznit položku menu rámečkem. Je to stejně jednoduché a web to oživí.
Stačí přidat do Divi > Nastavení šablony > Všeobecné > Přizpůsobené CSS toto CSS:
/*** Zvyrazneni menu - dynamicky ramecek - Zabza.eu ***/
#top-menu li {
padding-right: 15px;}
#top-menu > li > a {
padding: 15px 15px!important;
margin-bottom: 15px;}
#top-menu .menu-item-has-children > a:first-child:after {
display:none;}
#top-menu-nav > ul > li > a {
background: #3173b5;
color: #ffffff;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px transparent;
position: relative;}
#top-menu-nav > ul > li > a:before {
content: '';
position: absolute;
border: #3173b5 solid 4px;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-property: top, right, bottom, left;
transition-property: top, right, bottom, left;}
#top-menu-nav > ul > li > a:hover {
background: #7230b5;}
#top-menu-nav > ul > li > a:hover:before,
#top-menu-nav > ul > li > a:focus:before,
#top-menu-nav > ul > li > a:active:before {
border: #7230b5 solid 2px;
top: -5px;
right: -5px;
bottom: -5px;
left: -5px;}
Hotovo. A zítra zkusíme nechat menu létat.
DEMO
0 Komentářů