How to edit the 'content-over-media' padding in Impact theme?

Hello,

I am attempting to edit the position of the “content-over-media” in my Impact themed template however see that the padding property to do so is listed as an “Invalid property value.” When I edit this value in the theme.css code nothing happens. What do I need to do to ensure this property value is valid and driving any edits on the front end?

Thanks for any help in advance.

1 Like

Hi @cam-mason

I just like to clarify, you like to move down the content in your banner? Can i take a look, woud you mind to share your store URL? Thanks!

Hi @Made4uo-Ribe ,

I am attempting to move the content up; it is currently near the bottom of the image. The url is www.westporch.com.

Many thanks!

1 Like

Thanks for the info, If you like to locate the content in the center you can used this code.

From your Shopify admin dashboard, click on “Online Store” and then “Themes”.

Find the theme that you want to edit and click on “Actions” and then “Edit code”.

In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

@media screen and (min-width: 700px){
.sm\:place-self-end-start {
    place-self: center start !important;
}
}

Result:

if just a bit up, you can add padding.

.sm\:place-self-end-start {
    padding-bottom: 5rem;
}

Result:

You can adjust the size you like.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

1 Like

Excellent, thank you @Made4uo-Ribe . It worked!

1 Like

Good to know. Please be aware the mobile screen may give different view. Thanks!