Difference between Edge/Firefox and IE/Chrome

Hi!

I am busy creating a website with the Sydney theme. I’m having trouble with the different browsers.

MS Edge and Firefox: these browsers show the menu in the blue frame, this is what I want. But they create a strange gap between the header image and the first content (services).

IE and Chrome: these browsers do not show my menu in the blue frame… But they do not show the strange gap.

How can I make all of these browsers show my menu in the blue frame and no gap between the header image and the content? Thank you for your time!

Kind regards,
Niels

Ow: the website is http://www.psycholoogoudewater.nl/

Hello there,

I would like to apologize in advance for the inconvenience. Try adding the CSS code below into your site’s additional CSS option (Appearance > Customize > Additional CSS) or child theme’s style.css.


a{
  outline: none;
}

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Regards,
Kharis

Hi Kharis,

Thank you for your reply. I have added the css, but there is no visual difference. Do you have another suggestion?

Kind regards,
Niels

Hello there,

Try adding an !important argument to override other style rule might prevent it.


a{
  outline: none !important;
}

Regards,
Kharis

Hi Kharis,

The !important argument did not change anything I’m afraid.

Kind regards,
Niels

Do you have an other suggestion to fix these problems?

Hello there,

I would like to apologize in advance for the delay. It looks fine to me. Maybe it was just a matter of cache. Please try to clear your web browser’s cache, and then reload your page.

Let me know how it goes.

Regards,
Kharis

Hi Kharis,

I’ve cleared all cache, but there is no difference.

MS Edge and Firefox still create a strange gap between the header image and the first content (services). So when I scroll down, cntent of the page does not move up over the image, but the background shows itself. In IE and Chrome it works perfect…

IE and Chrome still show don’t show my menu in the blue frame… like Edge and Firefox do.

I’m clueless…

Kind regards,
Niels

Hi Kharis,

Did you comeup with a solution?

Kind regards,
Niels

Hello there,

I would like to apologize in advance for the delay.

To make me clear, could you please take a screenshot displaying the issue. For the image itself, upload to the free file hosting service like Google Drive or Dropbox, and then share its public link here.

Regards,
Kharis

Hi Kharis,

Here are some screenshots:

Before scrolling down there is no gap between the headerslider and the content:
Screenshot before scrolling

After scrolling down there is a gap between the headerslider and the content:

Screenshot after scrolling

The second bug in my website is in the menu, Chrome and IE do not show my menu as I want it:

Screenshot menu bug on home page

All browsers (Firefox, Edge, Chrome, IE) also have the bug on secondary pages:

Screenshot menu bug on secondary pages

This is how the menu looks on the home page in Edge and Firefox and this is how I want it:

Screenshot of menu on home page how I want it

I hope you have some solutions, because this is driving me crazy…

Kind regards,
Niels

Hello there,

Thank you for the screenshots. Let’s address them one by one.

> After scrolling down there is a gap between the headerslider and the content:

It happens because your slide image height is shorter. So that its movement leaves some space at the bottom part of the slide container, which its height equals to the screen’s. I’d suggest you to use 1920px x 1275px, which is the size used on our demo.

Regards,
Kharis

Hi Kharis,

That did the trick! The gap is gone. Thank you :-). I’m looking forward to your solution for the menu, after that I can publish the website.

Kind regards
Niels

Hi Niels,

Try adding the below CSS code:


.site-header {
  position: relative !important;
  padding-top: 0;
  padding-bottom: 0;
}

.site-header.fixed.float-header {
  position: fixed !important;
}  

Let me know how it goes.

Regards,
Kharis

Hi Kharis,

That worked perfectly! Thank you very much for the great help! This item is resolved :-).

Kind regards,
Niels

Dear Niels,

Excellent! Glad to know that helped.

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

If you don’t mind, could you please rate our Sydney theme here:https://wordpress.org/support/view/theme-reviews/sydney#postform like some of our users did? We would highly appreciate it if you do so.

Regards,
Kharis