Change col-lg-3 size

Question

I need my col-lg to have a different size depending on the resolution, for example:

How can this be done?

.col-lg-3 {
    /* styles for 1366x768px screen */
}
@media screen and (min-width: 1920px) and (min-height: 1080px) {
    .col-lg-3 {
        /* styles for screens larger than or equal to 1920px by 1080px */
    }
}

Which version of Bootstrap are you using? – snack_overflow Apr 20 '18 at 15:38 — snack_overflow, Apr 20 '18 at 15:38
My bootstrap version is 3 – Rafael Augusto Apr 20 '18 at 16:23 — Rafael Augusto, Apr 20 '18 at 16:23

score 2 · Answer 1 · answered Apr 20 '18 at 15:40

2

I'd recommend looking at the Bootstrap Grid System as this will help you gain a better understanding of how the col works for various screen sizes.

https://getbootstrap.com/docs/4.0/layout/grid/#grid-options

answered Apr 20 '18 at 15:40

snack_overflow

536
2
9
27

I read it, it was not enlightening to the point of solving my problem – Rafael Augusto Apr 20 '18 at 16:25
Another option would be this Bootstrap 3 tutorial on adding an '-xl' breakpoint: https://spin.atomicobject.com/2015/03/06/bootstrap-add-xl-grid-size-option/ – Robert Apr 20 '18 at 19:02

Change col-lg-3 size

1 Answers1