Header (featured) image resize

General
1

I’ve updated some plug ins and noticed that the header image (featured image) height has changed. It’s become very, very short from what it should be and I haven’t changed the images.

I’ve looked at settings and the forum but didn’t find my particular problem. Here’s an example.

1 Like
2

If you use a caching plugin (e.g. LiteSpeed), make sure that caching is disabled for logged-in users, and please try to refresh the cache

If the issue persists then please try this CSS snippet but please note that it can require further customization

.header-hero--title{
	padding: 3rem 0 !important;
}
3

Thank you, using the CSS worked. Is there any way to customize the header images for just mobile? Currently they’re too big using the desktop size.

4

hey brother i saw that you header has slider of image, how you’d did that?

5

I used a sliding gallery element in Elementor. It’s only being used on the homepage.

8

Please try this CSS snippet to make changes only on mobile but please note that it can require further customization

@media screen and (max-width: 47.99em){
	.header-hero--title{
		padding: 3rem 0 !important;
	}
}
9

That didn’t work, even with adjustments.

10

Please try to add custom CSS code snippets to Appearance/Customize/Additional CSS field.

This CSS snippet works for tablet and desktop

.header-hero--title{
	padding: 3rem 0 !important;
}

This CSS snippet works for mobile

@media screen and (max-width: 47.99em){
	.header-hero--title{
		padding: 3rem 0 !important;
	}
}
11

OK, that worked the second time. Thank you.

12

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.