BlueOwlCreative » Topic: Transparent Header breaks https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/feed/ Fri, 28 Aug 2026 08:04:33 +0000 http://bbpress.org/?v=2.5.3-5249 en-US https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29889 <![CDATA[Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29889 Thu, 15 Sep 2016 02:06:42 +0000 s2LED Hello –

I’ve been having an issue with the transparent header. It was working fine but then the display behavior got wonky.

http://saltedvine.ca/wp-content/uploads/2016/09/Screen-Shot-2016-09-14-at-3.34.23-PM.png

I disabled and enabled the TH on each page again.. Seemed to work for a bit.. Broke again. Updated Visual Composer. same results.
disabled w3 performance caching etc. same results..

Used smaller logos 300px width instead of 600px.. behaving now..

Had to use custom CSS to make the mobile Nav dark. Copied solution from another post.

Thanks!

]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29893 <![CDATA[Reply To: Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29893 Thu, 15 Sep 2016 07:36:46 +0000 BlueOwl Hi there,

Good job figuring this out.
I didn’t get what and how broke your transparent header though… :)

]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29899 <![CDATA[Reply To: Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29899 Thu, 15 Sep 2016 21:59:03 +0000 s2LED Please take a look at the site to see if you can give me any insight on this issue..

Screen shot.. http://saltedvine.ca/wp-content/uploads/2016/09/heder.jpg

The logo does not show up in Safari.. when you scroll down and up again the logo appears but shifted downward.

Works in Chrome and Mozilla but as soon as I turn on page Page Caching in W3 I get the white header effect in all three browsers.

Freaking bizarre.. I do have the transparent header manually set on every page.. This is th only toggle enabled.

Thanks.

]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29902 <![CDATA[Reply To: Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29902 Fri, 16 Sep 2016 06:59:39 +0000 BlueOwl Yes, there’s a fix for this, try adding this CSS:

.logo_img img {
max-width: 283px;
}
]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29906 <![CDATA[Reply To: Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29906 Sat, 17 Sep 2016 02:42:19 +0000 s2LED I tried this and it only got chrome to match the broken-ness of Safari.. On needs to scroll down and up again to get the header logo. Still shifted down in Safari

I’m using a row with a spacer as the same height as the menu to get the background effect. The menu is the only page with the Fortuna headings to create the hero image with background effect.

Could my logos be too big? I uploaded the same logo but 280 px wide.. Still the same behavior in Safari.

]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29908 <![CDATA[Reply To: Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29908 Sat, 17 Sep 2016 06:52:28 +0000 BlueOwl Sorry, it should be:

.logo_img img {
max-width: 263px;
}

Yes, your logo size should be 280px or 263px wide, then the retina version should be double that! Hope I can get a hold of a retina screen to test your case soon!

]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29922 <![CDATA[Reply To: Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29922 Mon, 19 Sep 2016 22:48:00 +0000 s2LED Hi BlueOwl.. I uploaded 2 new logos for main and transparent headers. Both are 264px wide and not as deep as the previous one. Both are fine in FF and Chrome but won’t display in Safari.. unless you scroll down then up.. but logo shifted down.

Other than these troubles I love this theme.

Also.. not a big thing but on the contact page when I scroll down to the google map. If I try scrolling up again the map get’s the scroll event instead of the DOM making it zoom in. I have to use the sidebar to get back up.

Cheerss

]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29927 <![CDATA[Reply To: Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29927 Tue, 20 Sep 2016 07:48:16 +0000 BlueOwl Hi again,

The Gmaps – you have an option to enable/disable the scroll wheel zooming.
The logo issue – please share a user/pass in a private reply so we can investigate this further! What version of mac/safari are you using?
Thanks!

]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29957 <![CDATA[Reply To: Transparent Header breaks]]> https://blueowlcreative.com/support_wp/forums/topic/transparent-header-breaks/#post-29957 Thu, 22 Sep 2016 01:43:45 +0000 s2LED