Image disappears when wrapped with tag in navigation
Permalink
My website: briankeschinger.com
I 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!
I 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!
After saving the page with the problem, have a look at the elements for what gets shown in the developer console.
I have no idea what happened, but when I went to put the link code back in to check the dev console it just worked perfectly fine. If it isn't broken don't fix it I suppose! So, I'll leave it as is.
You probably has a mismatched tag or other typo in the first attempt.
So after working on my site for another hour I noticed that the logo disappeared again and i'm not sure when it happened.
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?
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?
I had a look at the site and at the images and cant see anything out of place on the pages I tried. Could it be a hangover in your browser cache?
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.
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.
After commenting out the overflow attribute the image is there and is a proper link. Thanks for your patience!