CSS Padding is not working properly, it's looking as a margin

Question

I'm trying to write my column margin and padding with css on elementor, in order to make a media query to fit different desktop screens.

Selector is the way to use css in a specific element of the layout

selector{
    margin:0.5em !important;
    padding-top: 110px !important;
    padding-bottom:6em !important;
    padding-left: 3em !important;
    padding-right: 4em !important;
}

When I use padding, it moves down the margin insted of filling the column

Iused the same values in Elementor menu and Custom CSS

The site is:

https://fisherdog.com/home/

Answer 1

As I can see you don't apply the padding to the correct selector. You should apply it to the inner div instead (the child of the one you currently put it) From the inspector this is the div with calss="elementor-column-wrap elementor-element-populated". I tried and when I apply the padding on it, it looks as the other cards.