Image disappears when wrapped with tag in navigation
PermalinkI want the site-wide logo in the navigation bar to link back to the homepage (The shield with my name to the side of it). But as soon as I add the hyperlink to it, the image disappears completely. It doesn't matter whether it's in a content block and I add the hyperlink manually or if it's done by using an image block.
It doesn't go transparent, it just becomes a blank space on my webpage. But if I click the block while in edit mode, it shows in my WYSIWYG editor. It's just when I save that WYSIWYG editor that it becomes blank with the red dotted lines around that area.
I've checked my CSS for anything out of the ordinary, but I can't find anything. There are also other images on my site with hyperlinks around them and this doesn't happen. I'm thinking it may have something to do with it being a global area? But I'm mostly just shooting in the dark at this point.
Thanks in advance!

Trouble1 shows my dev console selected on the div that contains the logo area.
Trouble2 shows my dev console selected on the <a href...> tag that contains the logo image. I think it's something in this CSS but i'm not very good with CSS. Any ideas?
When you get a page with the problem, view that same page with a different browser and compare/check.
Shooting in the dark because I have no evidence, an aspect of the css that strikes me as having the potential for issues is the "#logo a { ovberflow:hidden;"
With the image inside floated, should there not be enough room (such as longer/more autonav entries), maybe this is flipping from showing all to having a zero width and showing nothing. Though it doesn't appear to do so when I resize the browser. So as I said above, such an idea is a complete shot in the dark.