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