Forums

max page/block width with responsive theme

Permalink
I've installed the Bootswatch theme and I'd like to limit the width of pages/blocks. I tried to add some CSS to bootstrap-responsive.css, bootstrap-responsive.min.css and to the theme template CSS but it didn't work. Here's my code:
@media (min-width: 768px) {
  width:768 !important;
}

Why isn't this working? It doesn't seem to be a caching issue. How can I accomplish my goal?

Edit: Maybe due to 768 missing px...hang on...

Edit 2: No. The px should have been there but there's still no effect.
 
enlil replied on at Permalink Reply
enlil
try using max-width
mcc5 replied on at Permalink Reply
@enlil: You're right that it should be max-width but the width is still not limited.

Corrected code:
@media (min-width: 768px) {
  max-width:768px !important;
}
Steevb replied on at Permalink Reply
Steevb
Have you tried:

@media screen and (max-width : 768px){
.something{ max-width : 768px
}
}
mcc5 replied on at Permalink Reply
@steevb: I'm pretty sure that adding "screen" wouldn't make a difference and that changing min- to max- would have the effect that the rule would apply on screens up to 768px wide, which would not be helpful. Thanks for the reply, though.
mcc5 replied on at Permalink Reply
For anyone who is interested, it turns out that I needed to specify a selector. Problem solved thanks to Bootswatch's developer.