html - From container to container-fluid on XS devices -
i saw 1 question in subject - answer there doesn't works.
so, said in title, have page <div class="container">
. want in extra-small devices (767px), container
become container-fluid
.
any suggestions?
if @ bootstrap css file, .container
class starts using fixed widths 768px
upwards - below (767px , below), spans 100% of parent, same container-fluid
(default div behaivour albeit 15px of padding either side):
@media (min-width: 768px) .container { width: 750px; }
in other words, on face of it, it's pretty pointless if ask me following style applies @ viewports:
.container, .container-fluid { margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; }
and since .container widths don't kick in until 768px , upwards, can see container
, container-fluid
styled same below 767px.
edit - further op's comments, remove padding left / right side of container, first append secondary class container div:
<div class="container nopadding">
this ensures don't overwrite bootstrap's default styling. can style follows:
.container.nopadding { padding-left: 0; padding-right: 0; }
important ensure above style placed in custom css file , referenced after bootstrap files.
Comments
Post a Comment