This topic has 3 replies, 2 voices, and was last updated 6 years by Kieran_SQ.

  • Author
  • #192808
     snakebyte99
    Participant

    Hi,

    I am using the page template with left sidebar and rightsidebar. I think its named “3 column middle” in your kleo layout options.

    I want to change the widths of each column from 25% 50% 25% to 20% 45% 35%.

    What is the best way to go about this?

    I have attached an example as of mock upof how I want it to look. This was done in CSS but is broken when you resize.

    Attachments:
    You must be logged in to view attached files.
    #192859
     Kieran_SQ
    Moderator

    Hi,

    Please try the below CSS in your KLEO Child theme’s style.css, make sure to completely purge any caching and your front-end cache to see the changes.

    COPY CODE
    @media screen and (min-width: 800px) {
    
    .sidebar.sidebar-main.col-sm-3.col-sm-pull-6.sidebar-3lr {
        width: 20% !important;
    }
    .template-page.col-sm-6.col-sm-push-3.tpl-3lr {
        width: 45% !important;
    }
    .sidebar.sidebar-extra.col-sm-3.sidebar-3lr {
        width: 35%;
    }
    .template-page.col-sm-push-3 {
        left: -moz-calc(20% - 1px);
        left: -webkit-calc(20% - 1px);
        left: -o-calc(20% - 1px);
        left: calc(20% - 1px);
    }
    .col-sm-pull-6 {
        right: 45%;
    }
    
    }

    Thanks,

    Kieran

    Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

    If you like the theme or the support you've received please consider leaving us a review on Themeforest!

    Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

    #193284
     snakebyte99
    Participant

    Hi works perfectly thank you

    #193323
     Kieran_SQ
    Moderator

    Glad I could help 🙂 Feel free to open a new ticket any time with any other questions and we’ll be happy to assist.

    Kieran

    Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

    If you like the theme or the support you've received please consider leaving us a review on Themeforest!

    Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

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

The forum ‘General questions’ is closed to new topics and replies.

Log in with your credentials

Forgot your details?