/- signs on single article page in woocommerce are slightly off

  • Resolved michaldybczak

    (@michaldybczak)


    10 years, 8 months ago

    This theme is literally THE BEST, THE MOST CUSTOMIZABLE theme I ever saw and it works great with woocommerce.

    I’ve have however this tiny problem. Plus and minus signs next to “add to cart” button are slightly off instead by each other.

    See it here: https://pl.tinypic.com/m/i6f8dj/1

    I tried to mess with css code but when I fixed this issue on product page it showed on cart page with even bigger gap, so I had to return to previous version.

    I’m not php, css or any code skilled so please, can you help me to fix this small problem, explaining slow and easy as to a child ;)? So what code must go where. Thanks ??

    I use Child theme, so I know that when it comes to extra php code, I should put it to function.php.

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

  • Hey there.

    Could you please link to your site so I can see it happening, that will help debug the issuer quicker as I don’t have this theme or Woo installed ??

    Cheers.

    Thread Starter michaldybczak

    (@michaldybczak)

    Thanks in advance:

    https://stolmet-zywiec.pl/sklep/

    Hey there.

    I guess when you experimented that you change the margin on it but where probably generally targeting it so that it affected the checkout page too. We could be more specific and ensure it’s only done a the single product page like:

    .single-product .minus{margin-bottom:10px;}

    If that doesn’t work you can try with !important to test:

    .single-product .minus{margin-bottom:10px !important;}

    Hope this helps.

    Thread Starter michaldybczak

    (@michaldybczak)

    Like I mentioned, I’m not into coding so I’m not sure if I am able to apply that.

    Does this code goes to style.css or funtions.php in child theme directory? I suspect that to css but I cannot be sure.

    I added this line to style.css and nothing’s changed but I suspect I must place it within some wider code to make it work.

    So far my style.css looks like:

    /*
 Theme Name:   Voyage Child
 Theme URI:    https://stolmet-zywiec.pl/voyage-child/
 Description:  Voyage Child Theme
 Author:       RewindCreation
 Author URI:   https://www.rewindcreation.com/
 Template:     voyage
 Version:      1.5.0
 Tags:         light, dark, two-columns, three-columns, right-sidebar, left-sidebar, responsive-layout, accessibility-ready
 Text Domain:  voyage-child
*/

@import url("../voyage/style.css");

/* =Theme customization starts here
-------------------------------------------------------------- */
mark {
display: none;
}

.single-product .minus{margin-bottom:10px;}

    With CSS the last item called is the one that takes priority. Using !important takes it out of the natural order of things.

    Looks like you’re using a child theme there, you could append this at the end of all other styles added.

    Or you can instead use a plugin if you like:

    https://www.ads-software.com/plugins/custom-css-manager-plugin/screenshots/

    https://www.ads-software.com/plugins/my-custom-css/screenshots/

    https://www.ads-software.com/plugins/pc-custom-css/

    https://www.ads-software.com/plugins/imporved-simpler-css/screenshots/

    Have a fantastic day! ??

    Thread Starter michaldybczak

    (@michaldybczak)

    The second one with the ! worked!

    BIG THANKS!!! ??

    The plugins above will be helpful too. Thanks again!

    It is a great day indeed! Have a great day too! ??

    You’re most certainly welcome! ??

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘/- signs on single article page in woocommerce are slightly off’ is closed to new replies.