c# - remove spacing between divs, bootstrap -
i have used twitter bootstrap separate <div>
follows
<div class="row" style="padding-top:10px;"> <div class="col-lg-6 col-md-6 col-sm-4 col-xs-4" style="border-style:dotted;"> <div class="row"> <div class="col-lg-3 col-md-3 col-sm-2 col-xs-2"> <label>period:</label> </div> <div class="col-lg-offset-1 col-lg-8 col-md-offset-1 col-md-7 col-sm-offset-1 col-sm-6 col-xs-offset-1 col-xs-6"> @html.dropdownlist("period", new list<selectlistitem>() { new selectlistitem{text = "last 7 days", value = "6"}, new selectlistitem{text = "last 15 days", value = "14"}, new selectlistitem{text = "last 30 days", value = "29"}, new selectlistitem{text = "last 90 days", value = "89"}, new selectlistitem{text = "last 180 days", value = "179"}, new selectlistitem{text = "last 365 days", value = "364", selected = true}, new selectlistitem{text = "custom", value = "0"} }) </div> </div> </div> <div class="col-lg-6 col-md-6 col-sm-4 col-xs-4" style="border-style:solid;"> <div class="row"> <div class="col-lg-6 col-md-6 col-sm-4 col-xs-4"> <input type="text" id="fromdatepicker" readonly="readonly" placeholder="from date" style="display: none; width: 78px; line-height: 25px;"> </div> <div class="col-lg-6 col-md-6 col-sm-4 col-xs-4"> <input type="text" id="todatepicker" readonly="readonly" placeholder="to date" style="display: none; width: 78px; line-height: 25px; "> </div> </div> </div>
as can seen, have divided row
<div>
in 6-6
. when reduce screen small size divs appear shown in attached image. want space removed when screen in xs
or sm
mode.
you can this:
<div class="row row-no-padding" style="padding-top:10px;"> .row-no-padding [class*="col-"] { padding-left: 0 !important; padding-right: 0 !important; }
or xs/sm:
.row-no-padding [class*="col-xs"], .row-no-padding [class*="col-sm"] { padding-left: 0 !important; padding-right: 0 !important; }
Comments
Post a Comment