anony1

I’ve had a bit of a break through I made the following ‘position’ value to center.
The sub menus ARE centered but now they’re in full view all the time instead of being hidden until rolled over.

Ideas? :-S

#secondary-nav li ul {
z-index: 9999;
position: center;
left: -999em;
height: auto;
width: 168px;
margin: 0 0 0 0px;
padding: 0 0 0 0px;

I meant that instead of just the text moving within the box that the entire box and text should move over so that it looks like this:

https://victoriaeightyfive.com/wp-content/uploads/2012/05/Screen2.jpg

So the text is central in the box and the whole text and box drop down is centrally underneath its parent on the main menu.

Sorry, it was my fault I wasn’t clear. Should have put up a screen grab first!

Thanks I will have a read and look into those errors.

Have tried that code if you want to have a look – still not quite right. What can I try next?

Thanks ??

Hi WPyogi – my firefox is on the blink at the moment (needs reinstalling no doubt) but I’m experiencing the problem in Chrome, Safari and in Safari on my iphone.

I’ve put a page up with screen grabs showing what I’m seeing:

How will I know how to spot and fix any errors? I’m not very fluent in HTML/CSS etc :-/

Thanks ??

Still having problems getting the submenus to line up. Would be really grateful if anyone could help me out ??

Cheers

Thanks WPyogi – I changed that like you suggested (actually changed the margin to 227px which made it line up perfectly)

‘#secondary-nav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 188px;
margin: 0 0 0 227px;
padding: 0 0 0 0;
}’

BUT

If any other menu item has a submenu the drop down just goes in the same place and doesn’t line up to it’s parent.

Ideas? :-S

Thanks!

I’m sure the answer is in there somewhere! I’ll have another go too.

Would really appreciate your help if you have the time to take a look at it later.

Thanks again for all your help ??
Victoria.

I will try that.

Would it help if I pasted the code I already have for this section below?

/***** Secondary Nav Menu ********************/

#secondary-nav {
	margin: 10px 30px 0 30px;
	overflow: hidden;
	clear: both;
	font-family: "Helvetica Neue", 'Kreon', serif;
	border-top: 1px dashed #cccccc;
	border-bottom: 1px dashed #cccccc;
}

#secondary-nav ul {
	text-align: center;
	list-style: none;
	margin: 0;
	padding: 0 0 0 0px;
}

#secondary-nav ul ul {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #E0E0E0;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 0 0px rgba(0, 0, 0, 0);
    margin:  0 0 0;
    padding: 0;
}

#secondary-nav li {
	display: inline;
	list-style: none;
}

#secondary-nav li a {
	color: #333333;
	font-size: 17px;
    font-weight: 300;
    margin: 0;
	padding: 8px 20px 10px 20px;
	text-decoration: none;
	display: block;
	display: inline-block;
	position: center;
}

#secondary-nav li a:hover, #secondary-nav li a:active {
	color: #FF0080;
}

#secondary-nav li a .sf-sub-indicator {
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	position: absolute;
}

#secondary-nav li li a, #secondary-nav li li a:link, #secondary-nav li li a:visited {
	color: #888888;
	width: 168px;
	font-size: 14px;
	margin: 0;
	padding: 5px 10px 5px 10px;
	border-bottom: 1px solid #efefef;
	text-transform: none;
	position: relative;
}

#secondary-nav li li a:hover, #secondary-nav li li a:active {
	background: transparent;
	color: #333333;
}

#secondary-nav li ul {
	z-index: 9999;
	position: absolute;
	left: -999em;
	height: auto;
	width: 188px;
	margin: 0 0 0 -1px;
	padding: 0 0 0 0;
}

#secondary-nav li ul a {
	width: 170px;
}

#secondary-nav li ul ul {
	margin: -33px 0 0 189px;
}

#secondary-nav li:hover ul ul, #secondary-nav li:hover ul ul ul, #secondary-nav li.sfHover ul ul, #secondary-nav li.sfHover ul ul ul {
	left: -999em;
}

#secondary-nav li:hover ul, #secondary-nav li li:hover ul, #secondary-nav li li li:hover ul, #secondary-nav li.sfHover ul, #secondary-nav li li.sfHover ul, #secondary-nav li li li.sfHover ul {
	left: auto;
}

#secondary-nav li:hover, #secondary-nav li.sfHover {
	position: static;
}

That’s great. All sorted! ??

Thanks so much for your help ??

Where abouts should I put that in the style.css?
Thanks

Sorry that didn’t work ??

Is there not a margin or padding value I can change to just nudge them down a bit?
I don’t mind them being aligned right. But they’re not inline with the text to the left of them.

Thanks.

Problem resolved ??

Thank you, I’ve posted the question there ??

Awesome.

Thank you both so much ??

Wow thanks so much!
It worked perfectly.

Any idea on which bit of code/how I get the horizontal top menu to align centre?

Thanks again!