Margins and Padding

PrinceGatsby · December 2016

Hi my page looks completely different on every screen. ie. not responsive at all.

I do not understand the relativity of margins / padding and have no idea how to set them so they look right on every screen.

please help..

Is there a formula i should use to set padding?

What is trhe correct setup?

http://hello1234.wpengine.com/academy/

Albert · December 2016

Hi,

your site is simply not responsive because you set margins for the columns that looks good on mobile only. To remove those wrap padding on mobile, you need to use the following css:

@media only screen and (max-width: 767px) {
    .wrap { padding: 0 !important; }
}

PrinceGatsby · December 2016

Thank you for your reply. That helps in that one case. But across the board is there a formula i should be using when deciding padding values?

Eg.. width in %?

Albert · December 2016

Sorry but we don't get what "formula" you are looking for exactly?

PrinceGatsby · December 2016

How do you know what % to make width in padding for responsive..

PrinceGatsby · December 2016

what are you calculating to do it exactly?

Albert · December 2016

To apply proper % of padding for responsive, it is necessary to use right css with @media rules. More details about @media rules you can find on http://www.w3schools.com/cssref/css3_pr_mediaquery.asp but theme rules you can find under responsive.css file.

Margins and Padding

Comments