No replies
zentili
zentili's picture
Offline
newbie
Italy
Last seen: 8 years 28 weeks ago
Italy
Timezone: GMT+1
Joined: 2012-12-06
Posts: 1
Points: 2

Hi all! I was wondering if posting here or in wordpress-related section.. but i thought here would have fit better. By the way. I've got this css dropdown menu made starting from wordpress theme's one, then i was trying to make the first dropdown (not the sub-menus) as big as the page content, as it would stretch into the white area just nearby the sidebar when it comes out from mouseover.. I hope it's clear what i mean: when you mouseover on "Recensioni", the dropdown covers the entire white area under him without covering the sidebar. I think i should say him to have a size relative to #page and not to its parent but wasn't having success. Here's the cod for my menu, hope for some help in this!

#access ul ul {
 background: none;
 
 
 
}
 
#access {
	background: #222; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#040300, #0a0a0a);
	background: -o-linear-gradient(#040300, #0a0a0a);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#040300), to(#0a0a0a)); /* older webkit syntax */
	background: -webkit-linear-gradient(#040300, #0a0a0a);
	-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
	-moz-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
	box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
	border-bottom: 3px solid #990000;
	clear: both;
	display: block;
	float: left;
	margin: 0 auto 6px;
	width: 100%;
 
}
#access ul {
	font-size: 13px;
	list-style: none;
	margin: 0 0 0 -0.8125em;
	padding-left: 0;
	font-weight: bold;
 
}
#access li {
	float: left;
	position: relative;
 
}
#access a {
	color: #eee;
	display: block;
	line-height: 3.1em;
	padding: 0 1.2125em;
	text-decoration: none;
}
#access li ul {
 
	display: none;
	float: left;
	margin: 0;
	position: absolute;
	top: 3.1em;
	left: 0;
	width: 672px;
	z-index: 998;
 
 
}
 
#access li ul ul {
 
	display: none;
	float: center;
	margin: 0;
	position: absolute;
	top: 3.1em;
	left: 0;
	width: 168px;
	z-index: 998;
	text-align:center;
 
}
 
#access ul ul ul {
	left: -25%;
	top: 2.7em;
	border-radius:20%;
 
}
#access ul ul a {
box-shadow: none;
/*	background: #f9f9f9;*/
	background: rgba(0,0,0,.94);
	border-bottom: none;
	border-left: none;
	border-top: 1px dotted rgba(40,40,40,1);
	border-right: 1px dotted rgba(40,40,40,1);
	color: #ebebeb;
	font-size: 13px;
	height: auto;
	line-height: 1.4em;
	padding: 10px 10px;
	font-weight: bold;
	font-size: 12px;
	text-shadow: 0 0 3px #000;
 
}
 
#access li ul ul a {
/*	background: #efefef;*/
background: rgba(35,35,35,.98);
width: 168px;
font-weight: bold;
font-size:11px;
float: bottom;
border-top:none;
border-bottom: 1px dotted rgba(0,0,0,.3);
}
 
#access li:hover > a, 
#access ul ul :hover > a,
#access a:focus {
	color: #9f6b00;
	background: rgba(30,30,30,.94);
	box-shadow: inset 0 2px 6px rgba(0,0,0,0.9);
	font-weight: bold;
	border-top:1px dotted rgba(0,0,0,.3);
	border-right:1px dotted rgba(0,0,0,.3);
	border-left:none;
}
#access li:hover > a,
#access a:focus {
 
	color: #000;
	text-shadow: 0 0 3px 5px rgba(0,0,0,1);
	background: -moz-linear-gradient(#9d9d9d, #fff);
	background: -o-linear-gradient(#9d9d9d, #fff);
	background: -webkit-linear-gradient(#9d9d9d, #fff);
	box-shadow: inset 0 1px 6px rgba(0,0,0,1);
	font-weight: bold;
	border:none;
}
 
#access li ul ul a:hover {
background: rgba(50,50,50,.9999);
box-shadow: none;
font-weight: bold;
text-decoration:overline;
color: white;
border-top:none;
border-bottom: 1px solid rgba(0,0,0,.6);
 
 
}
 
#access ul li:hover > ul {
	display: block;
 
}
#access .current-menu-item > a,
#access .current-menu-ancestor > a,
#access .current_page_item > a,
#access .current_page_ancestor > a {
	font-weight: bolder;
}

oh.. Laughing out loud the link! http://daylightsite.altervista.org