question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can we add sm, md, lg & large to .no-gutters?

See original GitHub issue

I find when I’m making websites that I’ll often want .no-gutters only on small screens, to keep a 3 column grid on small devices. This is dependent on the design of course, but I find it useful.

Can we look at adding .no-gutters-sm, .no-gutters-md, .no-gutters-lg and .no-gutters-xl to use this Bootstrap-specific property with breakpoints?

Current: https://getbootstrap.com/docs/4.0/layout/grid/#no-gutters Notation with breakpoints: https://getbootstrap.com/docs/4.0/utilities/spacing/#notation

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:14
  • Comments:8 (2 by maintainers)

github_iconTop GitHub Comments

6reactions
ProxyJoshuacommented, Jul 15, 2020

u could use <div class="px-0 px-sm-3"></div> p3=1rem

1reaction
ffooddcommented, Apr 23, 2020

@pepebe You may want to look closer at the documentation: https://getbootstrap.com/docs/4.4/utilities/spacing/#negative-margin

Read more comments on GitHub >

github_iconTop Results From Across the Web

Grid system - Bootstrap
Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system, five default responsive...
Read more >
Grid system · Bootstrap - Layout
It's based on a 12 column layout and has multiple tiers, one for each media query range. You can use it with Sass...
Read more >
Bootstrap Grid Examples - W3Schools
Below we have collected some examples of basic Bootstrap grid layouts. ... No gutters .col-sm-4 ... sm (tablets), md (desktops), and lg (larger...
Read more >
Grid System - PrimeFlex - PrimeFaces
Design is mobile first so smaller values can also apply to larger values e.g. md also applies to lg or xl if they...
Read more >
Layout and Grid System | Components - BootstrapVue
So, if you want three equal-width columns at any breakpoint, you can use <b-col cols="4"> . Column props sm , md , lg...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found