content 100% viewport on mobile landscape

Hey Paul,
Thanks for the feedback but I’m not seeing that your width is not 100% for landscape, but I do see that you have an un-closed media query rule at:

/*---START I-PAD-PRO-STYLES---*/

	@media only screen and (max-width: 1400px) {
		/* Add your iPAD-PRO Styles here */

this max-width: 1400px rule includes all of your other rules, so there is a good chance that if you are using Safari this is messing up the rest of your css.
I’m using Chrome on Windows which is a little more forgiving.
Try checking all of your css for other errors also, it may help to remove unused rules instead of commenting them out and removing extra comments.

Best regards,
Mike

Hi,
Thanks for the feedback, do you mean the width of the orange background or the blue bar at the top? I thought we were looking at the orange background. I don’t have an iPhone but I checked the page on a Mac with Safari in Responsive Design Mode using iPhone 8 plus and iPads in portrait and landscape and the background was full width, Please see the screenshots in the Private Content area.
Try clearing your browser cache following these steps for Safari and note step 4 where you will Clear the History.

Best regards,
Mike

Hi,
Sorry, for the orange background width I can’t reproduce it with Safari on Mac, as in the screenshots above, and I don’t have an iPhone 12, so I’m going to ask the rest of the team to check with their devices, thank you for your patience.
For the blue div try this css:

@media only screen and (max-width: 430px) {
.responsive #top #wrap_all #zamma-content-mobil .flex_column.avia-builder-el-23 {
	width: 101vw;
	left: -9%;
}
.responsive #top #wrap_all #zamma-content-mobil .app-links2 {
    justify-content: center;
}
}

Please see the screenshot in the Private Content area of the expected results.
For the logo on Safari desktop, I don’t see anything different affecting it compared to Chrome, try this css, which should help with desktop and iPad.

@media only screen and (min-width: 768px) {
.responsive.avia-safari #top #wrap_all span.logo {
	width: 278px;
}
}

Best regards,
Mike

Hi,
I believe part of your issue may be due to using the same element IDs multiple times, I see you are using id=’desktop’ 6 times on the frontpage and id=’mobile’ also 6 times and id=’mobil’ 2 times. Each element id should be unique, so instead of using IDs to style your element please use classes.
Please also disable all caching including Enfold Theme Options ▸ Performance ▸ JS & CSS file merging and compression
Based on your screenshot it looks like this missing background is occurring for you around 1100px, but I’m unable to reproduce this which is how I found the duplicate ids.
Don’t forget that while testing with Safari you will also need to Clear the History to properly clear the cache.

Best regards,
Mike

Hi,
Thanks for the screenshots, can you include an admin login in the Private Content area.

Best regards,
Mike

Hi,
Thank you for the login but I couldn’t reproduce the missing orange background image on my Mac with Safari, I tried at many different sizes. On the backend the desktop and mobile versions of this section look the same, is there a difference that I’m missing to make you want to use two sections? Can you use just one section for mobile & desktop?

Best regards,
Mike

Hi,
Thank you for your patience, I took a look at your grid row “Rasterzeile” I only found one on your homepage, it has the ID “zamma-mobile-9” but it is set to be hidden on screens larger than 990px and the iPad viewport is 1024px, so it will be hidden.

I see you have a custom class “zamma-screens-mobile” assigned to it but I don’t find any matching css, try un-checking the visibility option and creating a css rule to allow the visibility up to 1024px if you want this element to show on the iPad.
As for the blue bar, in my test on a Mac with Safari in Responsive Design Mode simulating an iPad (9.7″) & iPad Pro (10.5″) the bar is fullwidth in portrait view, in landscape it is hidden, iPad Pro (12.9″) it is hidden on portrait 7 landscape.
Which iPad are you using and was it your intention to only show the bar in portrait view?

Best regards,
Mike