Creating a responsive feature box.


I’ve created a feature box for mobiles to get email subscribers with a background image where the resolution is 600x450. I’m using the form containing the email box and buttons from MailChimp.
Then, i’ve placed it under the navigation bar(at the end of the header.php file) and resized it with the CSS to get a responsive box. But i need to create a bigger code in order to fit the box in every smartphone resolution by using the “@media screen” in my child theme CSS.
Is there any way to reduce my code and get responsive by inheriting any class of the theme?

I’ve attached an example of CSS for 1 resolution and the HTML code for the box.


Im trying put the code or attach it, but it is not working…

Hi @dhandrade,

I hope you are well today and thank you for your question.

Im trying put the code or attach it, but it is not working…

The .rar file is not supported to upload for security reasons so please try using .zip file.

Could you please share me the screenshot of it or page URL from your site where it’s displaying so that i can help you to make it responsive?

Best Regards,

Hi, Movin.

I’ve found a solution for my problem by not putting a background image, but a color… saved me a lot of time.


Awesome great to see you got that found.

Please advise if you have more questions.

Have a fantastic day!