Code css fix lỗi menu 3 cấp trên theme Flatsome

Code css fix lỗi menu 3 cấp trên theme Flatsome

Khi tạo menu 3 cấp trên theme Flatsome mà danh mục không đồng đều sẽ bị lỗi hiển thị rất xấu, làm mất thẩm mỹ của web, để fix lỗi này các bạn chỉ cầm thêm đoạn code css sau:

.nav-dropdown>li.nav-dropdown-col {
	display:block;
}
.nav-dropdown {
	border:1px solid #ddd;
	padding:0;
}
.nav-dropdown .nav-dropdown-col>a,.nav-dropdown li a {
	font-weight:normal !important;
	text-transform:none !important;
	font-size:15px;
	font-weight:500;
}
.nav-dropdown .nav-dropdown-col>ul li:hover {
	background:#053484; /* đổi màu tại đây */
}
.nav-dropdown-default>li:hover>a,.nav-dropdown .nav-dropdown-col>ul li:hover>a {
	color:white;
}
.nav-dropdown-default>li:hover {
	background:#053484; /* đổi màu tại đây */
}
.nav-dropdown-default>li>a {
	border-bottom:0 !important;
}
.nav-dropdown-has-arrow li.has-dropdown:before {
	border-width:10px;
	margin-left:-10px;
}
.nav-dropdown .nav-dropdown-col>ul {
	margin-top:-40px;
	box-shadow:2px 2px 5px #828282;
	display:none;
	position:absolute;
	left:100%;
	z-index:9;
	background:white;
	min-width:240px;
}
.nav-dropdown>li.nav-dropdown-col {
	width:100%;
	border-right:0;
}
.nav-dropdown .nav-dropdown-col>ul li a {
	padding:10px;
	text-transform:none;
	color:black;
}
.header-nav li.nav-dropdown-col:hover>ul {
	display: block !important;
}

Chúc các bạn thành công


Bài viết liên quan

Trang đăng ký tài khoản mặc định của Woocommerce trong WordPress chỉ có trường dữ liệu đó là
Bạn đang sử dụng theme Flatsome kết hợp với plugin Woocommerce làm website bán hàng nhưng ngay cả
Bạn đang sử website WordPress? Khi đăng bài bạn không tìm thấy nút căn đều 2 bên văn
Bạn đang gặp lỗi 502 bad gateway trong WordPress của mình? Lỗi này khá khó chịu vì nó