• JapeNZ

    (@japenz)


    Hi there,

    Version 6.3.1 adds 8px padding around my entire site, how can I remove it please?

    body {
    padding-top: 8px;
    padding-right: 8px;
    padding-bottom: 8px;
    padding-left: 8px;

    Also my Woocommerce product blocks (products added via shortcode) have massive margins on either side.
    How can I make them fill fill the space as they did before the update?

    <div class="woocommerce columns-5 ">

    .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    max-width: var(--wp--style--global--content-size);
    margin-left: auto !important;
    margin-right: auto !important;
    }

    https://ibb.co/HTVHr3M1

    Before update:

    https://ibb.co/Ng8W1G8j

    Thank you for your help!

    • This topic was modified 4 months ago by JapeNZ.
Viewing 7 replies - 1 through 7 (of 7 total)
  • arghadeep23

    (@arghadeep23)

    In Responsive Theme v6.3.1, a padding of 8px is added in the theme.json file in the following way :

    "styles": {
    "spacing": {
    "padding": {
    "top": "8px",
    "right": "8px",
    "bottom": "8px",
    "left": "8px"
    }
    }
    }

    This was meant for the Gutenberg page and post editor. Although it also tries to apply the style to the body, but the body gets a padding of 0px given using a higher specificity using the below style (which is there since <v6.3.1) :

    @charset "UTF-8";.site-description,.site-title,a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline
    }

    In your case, it seems like the 1st styling which should have been overriden by the 2nd styling – still gets a preference. Have you added any custom styles or modified the theme CSS by any chance ?

    Regarding the Woocommerce margin issue, we tried replicating the issue on our end, but did not observe any margin getting reduced.
    We would suggest you to kindly raise a ticket through our support forum and share us your site URL so that we can have greater clarity regarding your query. Please use this link to raise your ticket : https://cyberchimps.com/open-a-ticket/

    Thread Starter JapeNZ

    (@japenz)

    Hi @arghadeep23,

    Thank you for getting back to me 🙂

    I do have some custom styles, but wouldn’t it be better to apply the 8px padding specifically to the Gutenberg page and post editor, rather than adding it to everything and using addional code to remove it from everything except the Gutenberg page and post editor?

    The woocommerce product column margin thing is odd, as it seems to only effect the main page.
    I’ll try and work what’s causing it, as I’m assuming it will be a conflict with some custom css I’m using specifically on the main page.
    Hopefully one of us can figure it out once you’ve had a chance to take a look.

    I also noticed there’s forced underline css that effected breadcrumbs and fontawesome icons.
    I was able to remove it with this, though I’m not sure if this might break something else so figured I should check with you.

    /* Theme - Remove forced text-decoration: underline */
    a:where(:not(.wp-element-button)) {
    text-decoration: initial !important;
    }

    I’ve reverted by site back to v6.3.0 and created a staging site for testing, details are in the ticket opened as requested.

    Thanks again for your help.

    • This reply was modified 4 months ago by JapeNZ.
    Thread Starter JapeNZ

    (@japenz)

    Hello again @arghadeep23,

    So it looks like the margin thing is coming from the blocks used on the homepage.
    I was able to fix it by deactivating the block group setting for each block

    Layout
    Inner blocks use content width
    Nested blocks will fill the width of this container.

    Seems the content width was defaulting to 840px for some reason.

    edit:
    Looks like it comes from here:

    global-styles-inline-css

    :root {
    --wp--style--global--content-size: 840px;
    --wp--style--global--wide-size: 1200px;
    }

    • This reply was modified 4 months ago by JapeNZ.
    • This reply was modified 4 months ago by JapeNZ.
    Thread Starter JapeNZ

    (@japenz)

    Hello again,

    Regarding the 8px padding.
    Looking at the staging site, the css you mentioned should overrule the Gutenberg page and post editor css is there, but padding: 0; is crossed out.

    /wp-content/themes/responsive/core/css/style.min.css?ver=6.3.1

    .site-description, .site-title, a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
    }

    If I untick the padding added here:

    global-styles-inline-css

    body {
    padding-top: 8px;
    padding-right: 8px;
    padding-bottom: 8px;
    padding-left: 8px;
    }

    padding: 0; from /wp-content/themes/responsive/core/css/style.min.css?ver=6.3.1 becomes active.

    Hi @japenz,

    We’ve replied to your ticket on our support system regarding the same query. If you have any more queries related to your site, feel free to reach out to us [email protected] or raise a ticket using link : https://cyberchimps.com/open-a-ticket/

    Thread Starter JapeNZ

    (@japenz)

    Hi @arghadeep23,

    Yes thank you for your help.

    Just waiting for the next update to resolve the issue and I’ll mark the topic resolved.

    Hi @japenz ,

    We have fixed the issue in the latest version of Responsive Theme. Can you kindly check if its resolved at your end ?

Viewing 7 replies - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.