如何修复出现故障的下拉菜单?

时间:2014-09-17 19:22:19

标签: html css drop-down-menu menu opencart

我网站的菜单下拉似乎出现故障并且卡在屏幕上。不知道如何修复http://www.kingadlerhomedecor.com/store/

我想在此下拉列表中添加更多子类别,但我希望避免使下拉列表过于冗长。因此我想在下拉菜单中输入2行来调整子类别的长度列表,但它似乎不会发生,而是出现了一个新问题 - 下拉菜单项有一半卡住了我我无法解决这个问题。

我没有做任何改变,但似乎出现故障。不知道如何修复卡在我的屏幕上的下拉菜单。请指教。



/* MENU */
.primary-define #menu {
	text-align: left;
	font-family: helvetica, Arial;
	/*background-color: #999;*/
}
.primary-define #menu-inner {
	position: relative;
	font-family: helvetica, Arial;
	background-color: #999; /*No color was added origninally - added to make it grey*/
}
.primary-define .mainmenu {
	margin: 0;
	padding: 0;
	position: relative;
	list-style-type: none;
}
.primary-define .mainmenu li {
	margin: 0;
	padding: 0;
	position: relative;
	
}
.primary-define .mainmenu > li {
	float: left;
	/*background-color: #999;*/
	
}
.primary-define .mainmenu li a {
	color: #666;   /*originial #666*/
	display: block;
	font-size: 10px; /*original 15px */
	padding: 0.5px 1px; /*20px 25px */ /*Padding for the dropdown elements*/
	text-decoration: none;
	/*background-color: #999;*/
	
}
.primary-define .mainmenu > li > a {
	color: #fff;
	padding: 15px 25px; /*35px*/
	font-size: 14px; /*original 18px */
	font-weight: 600;
	line-height: 100%;
	font-family: helvetica, Arial;

}
.primary-define .mainmenu > li:hover > a,
.primary-define .mainmenu > li.active > a {
	background-color: rgba(0, 0, 0, 1); /*rgba(0, 0, 0, 0.2)*/
	/*font-size: 15px;*/
}
.primary-define .mainmenu li .dropdown-container {
	top: 99%;
	overflow: hidden;
	position: absolute; /*absolute*/
	padding-left: 1px; /*added by yuvi*/
	font-size: 30px; /*added by yuvi*/
}
.primary-define .mainmenu li .dropdown {
	margin-top: -300px; /*-999px*/
	background-color: #fff;
	border-left: 1px solid #eee;
	border-bottom: 1px solid #eee;
	font-size: 30px; /*added by yuvi*/
	padding: 10px;
}
.primary-define .mainmenu li:hover .dropdown {
	margin-top: 0;
	/*font-size: 30px; added by yuvi*/
}
}
.primary-define .mainmenu ul {
	margin: 0;
	float: left;
	width: auto; /*249px*/
	list-style-type: none;
	border-right: 1px solid #eee;
	
}
.primary-define .mainmenu ul li:hover a,
.primary-define .mainmenu ul li.active a {
	background-color: #eee; /*orginiarl #eee*/




1 个答案:

答案 0 :(得分:0)

margin-top必须为-380px。

.primary-define .mainmenu li .dropdown {
margin-top: -380px;
background-color: #fff;
border-left: 1px solid #eee;
border-bottom: 1px solid #eee;
font-size: 30px;
padding: 10px;
}

enter image description here