Menu rollover


#1

On Safari, when you mouse over a main menu item that has a dropdown, the dropdown menu flies in (rather awkwardly) from the left.
On Chrome and Firefox, there is no fly-in. Is this a bug on Safari? I’d prefer to have NO fly-in.

Thanks!


#2

Hi Goose22j,

You can try to edit your style.css in your theme directory.
change this line:

#mainnav ul li ul {
		width: 180px;
		position: absolute;
		top: 100%;
		left: -999em; 
		opacity: 0;
		visibility: hidden;
		-webkit-border-radius: 0 0 2px 2px;
		-moz-border-radius: 0 0 2px 2px;
		-o-border-radius: 0 0 2px 2px;
		border-radius: 0 0 2px 2px;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}

to:

#mainnav ul li ul {
		width: 180px;
		position: absolute;
		top: 100%;
		/* left: -999em; */
		opacity: 0;
		visibility: hidden;
		-webkit-border-radius: 0 0 2px 2px;
		-moz-border-radius: 0 0 2px 2px;
		-o-border-radius: 0 0 2px 2px;
		border-radius: 0 0 2px 2px;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}

#3

Is this something I should be changing in a child theme? and if so, would i just post the new entry in its entirety in the child theme?


#4

Yup, It’s better if you save your modified style.css in your child theme. So, your modified files will not replaced when you update your themes