Header Logo spacing on Safari Browser

'm testing a logo, JustTheDriverLogo-1.jpg, in the masthead of my website and it looks fine in later versions of IE and Firefox, but when I check it on my Iphone (Safari), there is a space between the logo, in the upper left part of the masthead, and the navigation bar below it. How can I make that space disappear in Safari?

here is the website:

http://JustTheDriver.com

Thanks Experts!!
TonyT7220Asked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
David S.Connect With a Mentor Commented:
It seems that the space is because the text on the right side of the header needs more space, so it makes the header grow in height which creates the gap under the logo.

What I would suggest doing is give a class (e.g. "phone") to the <br> between the phone numbers and then use CSS3 media queries to hide it on the iPhone.
@media screen and (max-device-width: 480px) {
  br.phone {display:none}
}

Open in new window

Screenshot is from BrowserCam:
EE-Q-26888971-iphone.jpg
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.