We have bootstrap settings for large screen as:-
/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
}
I want to override to max-width : 1920px. How can I do this without hacking the core?
Note: I am maintaining my front end dependencies via bower, so I want the changes to be maintained on the custom CSS files. Is there any way to "override" those configurations?
You can use and to chain together multiple test conditions: @media screen and (min-width: 480px) and (max-width: 960px) { ... } To specify that only one of the conditions needs to be true (similar to or), separate the conditions with commas: @media screen and (max-width: 760px), tv and (max-width: 1200px) { ... }
To override a specific media query rule, append a new css rule after the one you want to override. For example, if the last css rule does not have a media query attached, it will override all previously declared media queries (presuming the same selectors).
Q 7 - Which of the following is correct about Bootstrap Media Query? A - Media queries have two parts, a device specification and then a size rule.
We use a handful of media queries for delivering different styles sheet to different devices, to create sensible breakpoints for our layouts and interfaces. These breakpoints are mostly based on minimum viewport widths and allow us to scale up elements as the viewport changes.
Use the customize page on the documentation to create a custom version.
http://getbootstrap.com/customize/#media-queries-breakpoints
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With