Streaming live at 10am (PST)

Why are my padding settings ignored?


#1

Hey there.
I think it´s a stupid question and can be solved really fast… i hope.
Why are my padding settings ignored as shown in the image?
I´ve got a read only link for you. Here
The page with the issue is called “Prints”.

Thanks for help!


Here is my site Read-Only: LINK
(how to share your site Read-Only link)


#2

Hey @Nilson,

I think it’s because you centered it with flexbox.
Center your image and your cross with auto margin like so

And remove the flexbox on the parent element

Now padding should work as expected.
Hope this helps,


#3

Hey @zbrah,
thank you for your answer!

I have implemented your proposal. Now the top-padding works fine. Cool!
But for some reason, the cross, at the bottom, continues to be ignored…
Although it is in the same div container as the picture. :confused:

Read only LINK

I´m glad to hear from you.


#4

Hey @Nilson, yeah i’m not sure why, i guess it’s because the parent is fixed.
But however, just solve it with maths.
Close X Divis 40px height, top margin of it is 16px.

So if you top padding 80px on Full screen Print, bottom padding 80+40+16px
If you want to vertically center, flexbox is still the easier option, but don’t use paddings if you use flexbox.
Set a fix height for your image (let’s say 90% height) and so this.

01

Hope this helps,