CSS Customization: help

  • Resolved sagibinder

    (@sagibinder)


    4 years, 1 month ago

    Hello
    I would like to get help with the 3 issues please,
    1. In the mobile view, I want that the text “showing 1-8 of 14 results” and the sorting filter will be on the same line and not below each one.
    For example “showing 1-8 of 14 results” will be on the right side of the line and the filter will be on the left side.
    how can it down by CSS code?
    Whats-App-Image-2021-02-09-at-3-45-08-PM

    2. In the footer, I would like to remove the “-” between each title, before the title start and after it.
    for example to remove both “-” from | “-” NEWSLETTER “-“, same for “BE SOCIAL AND FOLLOW US!” and ” WE’RE HERE TO SUPPORT”
    Can you please advise regarding the code

    3. On the “Cart” page, In “You may be interested in…” title, the products shown below the title are the same size in the main shop page,
    How I can resize it to half? or to arrange them in a line? or to locate them before the “Carts total” it’s doesn’t look good right now.
    Cartpicpaste

    The page I need help with: [log in to see the link]

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

  • Hi, @sagibinder

    Try adding this in Dashboard – Appereance – Customize – Additional CSS in the Customizer

    1. The first rule is to do what you asked. The 2nd rule is to correct a new additional white space. 

    @media all and (max-width: 500px){
.woocommerce .woocommerce-result-count,
.woocommerce-page .woocommerce-result-count {
    width: 50%;
    float:right;
    text-align:right;
}
.site-content {
    margin-top: -100px !important;
}
}

    2. Footer widget lines:

    footer .widget .widget-title:before,
footer .widget .widget-title:after {
    width:0px;
}

    3. I’m not sure I understood exactly what you want here. This is just a solution to make those products (and their titles) smaller, but if you want a different location, that can’t be done via CSS, but by more advanced coding. 

    .woocommerce-cart .cart-collaterals .cross-sells ul.products li{
 width:45%;
}

.woocommerce-cart .cart-collaterals .woocommerce-loop-product__title{
font-size:20px!important;
}

    You can learn how to use the Chrome Developer Tools or Firefox Developer Tools to help you see and test changes to your CSS.

    PS: At this point, with your previous topics you might consider having a child theme with all these modifications. ??

    Hope this helps,
    Kind regards!

    Thread Starter sagibinder

    (@sagibinder)

    Hi Vlad
    Thanks again for your quick and professional answer!
    Why do I need a child theme? Is it necessary if I have automatic backups

    Happy to help!
    I started to know by heart that site ??

    Why do I need a child theme? Is it necessary if I have automatic backups

    You don’t need one. It was more of a thought. If you know how to create one, you might consider creating one, but it’s not mandatory. Additional CSS code is stored in the database, so if you have regular backups then no need to worry. If you want to make more serious modifications to your theme – such as putting things in other locations, then a child theme might be handy.

    If your question has been answered, we would love if you would mark this topic as resolved in the sidebar. This helps our volunteers find the topics that still need attention and more people will get helped, possibly like you did.

    Thank you!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘CSS Customization: help’ is closed to new replies.