Twenty Eleven – Nav Menu Bar and Search Box look TERRIBLE on iPhone

  • Hi all, I’m having trouble with my site, SessionBassistOnline.com. It looks fine on Safari and Firefox, but is absolutely a wreck on the iPhone. The nav menu bar, instead of doing a float:left, like it should, lines up vertically. Furthermore, the Search box, which should be to the right of the nav menus, is covering up the logo image. I’m really not sure what’s I’ve done wrong here.

    Can someone please point me in the right direction?

    Thanks!!
    js

Viewing 2 replies - 1 through 2 (of 2 total)

  • As you moved the search in the child theme you will need to change the style for the mobile.

    In your child themes style.css add styles like:

    @media handheld, only screen and (max-width: 767px) {

	#searchform {
		margin-top: -1em;
	}
}

    This is an example, you would need to experiment, you do not need to load it into an iphone for testing, just resize the browser window, the menu is working as expected.

    Add your styles nested inside the media handheld section!

    Regards

    David

    BJBusch84

    (@bjbusch84)

    has anyone had any luck with improving the menu bar on iOS? Here’s a screenshot of what my site looks like right now. Is there a way to get it look more like it does in a normal browser? Thank you.

    https://www.edgeeks.com

    iPhone Screenshot: https://img9.imageshack.us/img9/3692/photohf.png

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Twenty Eleven – Nav Menu Bar and Search Box look TERRIBLE on iPhone’ is closed to new replies.