Columns Issues

Sparkling
1

In the link, https://colorlib.com/sparkling/sparkling-shortcodes/, I noticed the 3-column and 4-column text did not show up correctly at browser size 1200 (I used the tool http://howbigismybrowser.com). The 3-column showed up as one column. I’ve attached the screenshot. And the 4-column showed up as two column.

How can I fix the 3-column and 4-column to be visible at browser size (1000-1200)?

Thanks!

2

Hi @lillaik,

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

This is how by default the Bootstrap grid system / columns work which you can see on the following page.

https://getbootstrap.com/examples/grid/

Best Regards,
Movin

3

I understand, but I would like the 3-column and 4-column to be visible at browser size 1000. How can I fix the code?

Thanks!

4

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS



@media (min-width: 1000px){
  .col-lg-4 {
    width: 33.33333333%;
}
.col-lg-3 {
    width: 25%;
}
}
5

Thank you!

6

You are most welcome here :slight_smile: