Cara Membuat Menu Navigasi Scroll ke Samping di Bawah Header Blog

Kak Her

Selanjutnya tambahkan CSS Code berikut ini tepat di atas kode ]]></b:skin>

/*--- idnxmus nav-scroll ---*/
.second-menu {
left:0;
right:0;
top:48px;
display:none;
max-width:100%;
overflow:scroll;
overflow-y:hidden;
position:fixed;
z-index:5;
background:#fff;
height:35px;
line-height:12.5px;
font-size:13.5px;
font-weight:500;
box-shadow:0 2px 6px 0 rgba(0,0,0,.1);
}
.second-menu ul {
width:max-content;
margin:0 0 0 90px;
}
.second-menu ul li {
float:left;
font-size: 12px;
padding:6px 8px;
display:block;
text-align:center;
text-transform:uppercase;
}
.second-menu ul li a:hover {
color:#49ACE1;
border-bottom:2px solid #49ACE1;
}
.second-menu ul li a {
color:#444;
padding: 8px 5px;
}
.second-menu ul li.satu1 {
padding: 0;
position:fixed;
left:-1px;
}
.second-menu ul li.satu1 span {
background: #444;
padding:11.5px 10.5px 10px;
color:#fff;
vertical-align: -6px;
}
.second-menu ul li.satu1:after {
content:'';
display:inline-block;
position:absolute;
border-left:12px solid #444;
border-top:8px solid transparent;
border-bottom:8px solid transparent;
right:-10px;
top:4px;
}
@media screen and (max-width: 640px) {
.second-menu {
display:block;
}
}

Selanjutnya cari CSS Code berikut ini.

@media only screen and (max-width:640px) {
#wrapper {
padding: 70px 15px 15px;
}

Lalu ganti dengan CSS Code ini.

Artikel Terkait

Bagikan:

Tinggalkan komentar