Docs

[blueprint]

Hey there,

I have an issue with content loading in safari and apple devices (images, fonts and sliders).

Also alignment problems with the logo and mobile button in the header.

Can you tell me why and how to fix this?

Thank you!

[Nico]

Hi There,

Thanks for writing in.

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks.

[blueprint]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for writing in!

#1. You are using the font-family like :

/*call to action Button*/
  .Anfrage { 
  background-color: #transparent; 
  border: 2px solid #ffffff; 
  box-shadow: none; 
  color: #ffffff;
  font-family: Source Sans, 600;
  font-weight: 600;
  font-size: 15px;
}

But there is no font-family like “Source Sans” rather it should be “Source Sans Pro”. In other browsers, it’s getting ignored and using the body font which is Source Sans Pro. But Safari using the fallback instead. Let’s fix it for all custom CSS you have added.

#2. Logo issue also causing by your custom CSS :

.x-btn-navbar, .x-btn-navbar.collapsed {
  margin-right: 100px;
  margin-top: 10px;
}

#3. Your image name is Gebäudetechnik_001.jpg which can not be recognized by Safari. You should not use such character in file name.

Hope this makes sense.

Cheers!

[blueprint]

Thanks for your help!

I fixed #1 and #3.

About #2 (Logo and mobile menu button alignment): What is your suggestion / the right code if this one is a problem? It works fine on desktop browsers and android mobiles. The problem occures in safari on iphone.

Thanks!!

[Rupok]

Hi there,

Thanks for writing back. What you are trying to achieve for the logo and menu icon? It looks same on every browser. Do you want to stack them or side by side?

[blueprint]

Sorry for the delay!

I want them to be next to each other (see screenshot), wich works fine on all screens exept on ipohne 🙁

[Christopher]

Hi there,

Please add following code :

@media (max-width:320px){
a.x-brand.img {
    width: 41%;
    margin-top: 0;
}
}

Hope it helps.

[Author]

Posts