Public Ticket #2240027
Responsive Columns


  • Brandon Buck started the conversation

    I have a page that's 4 columns wide on desktop, that I want to control the number of columns as it scales down. The
    CSS code appears to only apply to one horizontal column. Can I set the number of columns based on particular screen sizes?

  •  1,701
    Support Agent replied

    Hi Brandon,

    In order to achieve that you should use media query and appropriate css code for example:

    if you want to display 2 columns on mobile device you would use this css:

    @media (max-width: 768px)
    .bt_bb_column[data-width="3"] {
        -webkit-flex-basis: 50%;
        flex-basis: 50%;
        max-width: 50%;

    To adjust displaying on other resolutions change break-points, if you want to display more or less column in one row change percents.

    Let us know if you need additional assistance.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!