How can I resize the blog header image on Yuva theme for desktop?

Dear all,

Hope you are well! I’m adding blogs to my website on Yuva Theme, for example here (pw = Test1!), but the header image loads huge on desktop. It scales well on mobile however.

Is there a way to ensure it’s a lot smaller on desktop?

Thank you and kind regards,

Philip

Hey @Philip7644

Pls follow below steps:

  1. Open your theme editor.

  2. Find and Open your blog template.

  3. Choose the image section with the issue.

  4. Copy the provided CSS code and paste it into the ‘Custom CSS’ input textbox, which is usually found at the bottom-right corner of the theme editor.

@media (min-width: 768px){
  .image-wrapper {
   padding-bottom:30%;
 }
}

@media (max-width: 768px){
  .image-wrapper {
  padding-bottom:60%;
}
}
1 Like

Hey @Sonya_2025 ,

Thank you for your reply, appreciate it!

I’ve tried your suggestion with the custom CSS but unfortunately, it doesn’t work.

Is there another option we can try?

Thank you and kind regards,

Philip

Hi Philip

Pls open your theme code editor and find the below code I marked out and remove it. Then do the steps above.

Feel free to DM to me if you have further questions.

1 Like

Hi @Sonya_2025 ,

Thanks for getting back to me! I can’t find that line of code anywhere unfortunately.

In which file exactly should that be for the Yuva theme?

Kind regards,

Philip