Pokud se nám do vzhledu webu hodí celistvá lišta menu, můžeme aktivní části nechat z lišty povystoupit. Opět jednoduše – vložením CSS do Divi > Nastavení šablony > Všeobecné > Přizpůsobené CSS.
/*** Zvyrazneni menu - lista s vystupujici polozkou - Zabza.eu ***/ @media only screen and (min-width : 981px) { .et_fullwidth_nav #main-header .container { padding-right: 0px!important; padding-left: 0px!important;} #et-top-navigation { background: #3173b5;} .et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation { padding-top: 0px!important; padding-left: 13px!important;} #top-menu li { padding-right: 15px;} #top-menu > li > a { padding: 15px 15px!important; margin-bottom: 0px; margin-top: 0px;} #top-menu .menu-item-has-children > a:first-child:after { display:none;} #top-menu-nav > ul > li > a { color: #ffffff; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; -webkit-transition-duration: 0.1s; transition-duration: 0.1s; -webkit-transition-property: box-shadow, transform; transition-property: box-shadow, transform;} #top-menu-nav > ul > li > a:hover, #top-menu-nav > ul > li > a:focus, #top-menu-nav > ul > li > a:active { background:#214c79; color:#ffffff; opacity:1; z-index: 99999; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 1.0); -webkit-transform: translateZ(0) scale(1.1); transform: translateZ(0) scale(1.1);}}
A to je vše. V tomto návodu i miniseriálu. Doufám že to někomu pomůže třeba k oživení a nebo třeba i zpřehlednění webu. A nebo k poznání, že i tak dokonalá šablona jakou Divi bezesporu je, může být vylepšována a to i svépomocí.
DEMO
0 komentářů