How to keep counters in one row on mobile?

Home Forums Jevelin Theme How to keep counters in one row on mobile?

Home Forums Jevelin Theme How to keep counters in one row on mobile?

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    RESOLVED Posts
  • How can I modify the responsive behavior of counters in corporate template?

    I would like keep in in one row on tablet and keep 2 of them in one row on mobile. At the moment all counter goes in one column bellow 800px

    Hi @zsolt67,

     

    I hope you are well today and thank you for your question.

     

    Could you please share me the page URL from your site where it is displaying so that i can help you to achieve it?

     

    Best regards,
    Shufflehound team

    http://www.fittedwardrobeslondon.com

    I prefer – if possible – without css, which is more flexible or please explain little bit the css.

    At the moment the font size doesnt change just the column space shrinking.

    I would like to decrease the fontsize too on mobile and keep the original on tablet.

    Solution for this topic

    You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

    @media (max-width: 800px){
    .sh-section-a09ab805ff4fac305e6b3b8ed673ae71 .sh-column {
        width: 50%;
        float: left;
    }
    }
    
    @media (max-width: 550px) {
    .sh-section-a09ab805ff4fac305e6b3b8ed673ae71 .sh-column .sh-table-cell.text-right * {
           font-size: 30px;
    }
    
    .sh-section-a09ab805ff4fac305e6b3b8ed673ae71 .sh-column .sh-table-cell.text-left * {
           font-size: 10px;
    }
    }
    
    @media (max-width: 340px){
    .sh-section-a09ab805ff4fac305e6b3b8ed673ae71 .sh-column {
        width: 100%;
    }
    }

    thank you wroked perfectly

    You are most welcome here 🙂

Viewing 6 posts - 1 through 6 (of 6 total)