"e" falling off "Home" on mobile menu

• 

  teeschneider · Member · Feb 13, 2014 at 3:03 am

  • Copy link
  • Add topic to favorites

  Hi there,

  I’m using the Themify free them. When I look at it on iPhone the letter “e” on the “home” menu item is pushed to the next line. I am using a child theme but not sure what to create or edit to fix this. Hoping someone can help!

  Site: http://wwwTouchTheCow.com

• 

  teeschneider · Member · Feb 13, 2014 at 3:04 am

  • Copy link

  http://www.TouchTheCow.com

• 

  teeschneider · Member · Feb 13, 2014 at 5:13 am

  • Copy link

  And now I’ve realized it’s not simply on mobile. The same behaviour occurs if i just shrink the screen down on my desktop.

• 

  teeschneider · Member · Feb 13, 2014 at 10:04 pm

  • Copy link

  I fixed that problem by increasing the width to #main-nav… below to 52 px but now I can’t get the little house icon to sit centered in the button.

  It seems to me that the icon is already set to be centered??

  //
  #main-nav .home {
  width: 42px;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  }
  #main-nav .home a {
  background: url(images/home-icon.png) no-repeat 14px center;
  width: 16px;
  text-indent: -9000em;
  }//

• 

  teeschneider · Member · Feb 14, 2014 at 1:47 am

  • Copy link

  ok. I realized 2 things:

  1st, you don’t support this theme. just figured that out, sorry.

  but 2, I fixed it by adding padding-left of 10px to make up for the 10px i added in width to the button.