Title page behaving weirdly in responsive mode

Airi
#1

Hello. I am having some issues with my website regarding responsive design. When I minimise my window manually It get’s really buggy at about the half way line. You can see that under www.schlieper.ch. How can I fix that?

Also in tablet mode the header becomes black instead of being transparent how it would be in desktop mode. Any fixes?

#2

Hi,

Thank you for contacting us. I am happy to help with your queries.

Can you point me to the title area needing help with? What does the text say?

Regards,
Kharis
aThemes Support

#3

Well on one hand It concerns the heading (meaning the menu and the icon area). And then the landing strip part with the text: Making innovations successful in the market faster, for startups and new business areas.

As experienced entrepreneurs and active investors,
we ensure product-market fit and financing.

#4

Hi,

Thank you for getting back.

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (max-width: 1199px) {
    	 .home .sticky-wrapper .site-header {
    		 background-color: transparent !important;
    	}
    	 .home .site-header {
    		 position: relative !important;
    		 z-index: 99999 !important;
    		 background-color: transparent !important;
    	}
    	 .home .site-content {
    		 margin-top: -95px;
    	}
    }

Seems likely the top header image and its content were made with Elementor. To fix the responsiveness issues on this part, I’d recommend checking this page, that will guide you with responsive layout editing.

I hope that helps.

Regards,
Kharis
aThemes Support

#5

This seems to have fixed it. Thank you. It however created another issue: the text on the title page. My goal is to have it look on all devices how it looks on desktop. Title on top, then text underneath the runway. However on the tablet it seems to not align properly and: on mobile the background goes over the screen (Which it shouldn’t). Is there a fix for this without using fixed positions?

#6

You’re welcome!

Seems likely you’re asking about specific layout editing with Elementor. Thus, I’d recommend checking the official community support channel of Elementor at: https://wordpress.org/support/plugin/elementor/.

Regards,
Kharis
aThemes Support