Menü kodları:
#header{
box-shadow: 0px 1px 3px rgba(190, 190, 190, 0.5);
position: fixed;
z-index: 10;
background-color: #fff;
height: 80px;
}
#header .container{
position: relative;
}
.menu {
float:left;
}
ul.menu,
.menu ul{
padding: 0;
margin: 0;
}
.menu li ul li{
margin-left: 0;
}
.menu li {
display: inline-block;
margin-left: 13px;
margin-right: 13px;
position: relative;
line-height: 34px;
}
.menu .sub-menu li {
display: inline-block;
margin-left: 0;
margin-right: 0;
position: relative;
line-height: 16px;
}
.menu li a {
font-size: 14px;
font-family: 'Open Sans', sans-serif;
font-weight: 400;
text-transform: uppercase;
color: #333333;
display:block;
line-height: 80px;
-o-transition:.3s;
-ms-transition:.3s;
-moz-transition:.3s;
-webkit-transition:.3s;
}
.menu li.current-menu-item> a, .menu li.current_page_item> a, .menu li a:hover {
color:#00ACDF;
}
/*** DROPDOWN ***/
.menu .sub-menu,
.menu .children {
background-color: #fff;
display: none;
padding: 0;
position: absolute;
margin-top:0;
left: -13px;
z-index: 99999;
-webkit-box-shadow: 0 5px 4px -4px rgba(190,190,190,.1);
-moz-box-shadow: 0 5px 4px -4px rgba(190,190,190,.1);
box-shadow: 0 5px 4px -4px rgba(190,190,190,.1);
}
ul.menu ul a,
.menu ul ul li a {
color: #333333;
margin: 0;
padding: 10px 10px;
min-width: 200px;
line-height:20px;
-o-transition:.25s;
-ms-transition:.25s;
-moz-transition:.25s;
-webkit-transition:.25s;
transition:.25s;
border-top:1px solid #f4f4f4;
}
.menu ul ul li:first-child a{
border-top: 0px solid #ddd;
}
ul.menu ul li,
.menu ul ul li {
padding-right:0;
margin-right:0;
}
ul.menu ul a:hover,
.menu ul ul a:hover {
color: #fff;
background:#00ACDF;
}
ul.menu li:hover > ul,
.menu ul li:hover > ul {
display: block;
}
.menu .sub-menu ul,
.menu .children ul {
left: 100%;
top: 0;
}
fixed yapmadan öncesi:
Sonrası: