mobile navigation

[f2t]

Hey,

I seem to have messed up the mobile navigation on my site, I would like it to be more like the original rather then the current navigation. I just cant see where I have messed it up. can you point me in the right direction?

http://www.gingermagic.co.uk/

Thanks

Toby

Topic

[Jason Bobich]

Looks like the same issue as before. You’re arbitrarily applying fixed widths to elements within the header.

This seems to be effecting the navigation:

.primary_light_blue #access ul {margin-top:98px; width: 940px; background:#00314E; height:48px; margin-left: 0px; }

And also because you’re changing the font-size of the buttons, you’re overriding anything that came before in the theme’s responsive styles applied at different media queries. So, you need to account for that in your custom styles.

/* Styles for Tablets */
@media (max-width: 800px) {
	.whatever { ... }
	.whatever_2 { ... }
	.whatever_3 { ... }
	.whatever_4 { ... }
}

/* Styles for Mobile Devices */
@media (max-width: 480px) {
	.whatever { ... }
	.whatever_2 { ... }
	.whatever_3 { ... }
	.whatever_4 { ... }
}

[Jason Bobich]

I’m honestly not entirely sure what you did but I’d also have a look at whatever you’re doing here in header.php. You seem to have messed up the HTML markup a bit. I’m not sure if it’ll display consistently in all browsers now like IE that have trouble interpreting what you “meant” to write like Firefox and Chrome do a good job of.

[Author]

Replies