CODEWITHSUNDEEP
htmlcsstwitter-bootstrap-3padding
Santhucool
Santhucool

Reputation: 1706

Need to remove padding on slider due to class= 'hidden-xs col-sm-3' in bootstrap3

I am creating a slider in my page using bootstrap3 as following:

/*Add css here*/
<section id="slider">

                <ul class="rslides" id="modest-slider">

                    <li class="slider-wrapper hidden-xs col-sm-3">

                        <div class="slider-img-container"><img src="assets/images/slider1.png" alt="slider1" /></div>
                        <div class="slider-caption container">
                            <div class="row">
                                <div class="slider-caption container">
                                    <div class="col-xs-10 col-sm-5" style="background: rgba(255, 255, 255, 0.4 );">
                                        <h1_2>Exclusively New Concept!</h1_2>
                                        <p class="slider-description2">
                                            Inspired by Scandinavian Design and made with all the richness from India, we present an exclusive range of home furnishing products ...
                                        </p>
                                    </div>
                                </div>


                            </div>
                            <!-- /.row -->

                        </div>
                        <!-- /.slider-caption -->

                    </li>
                    <!-- /.slider-wrapper -->
    </ul>
    </section>

I am using hidden-xs col-sm-3 class for hiding the slider on resizing, But when I use this class my banner get padding in left and right: Please refer the screen shots:

Slider with hidden-xs col-sm-3

Image with class hidden-xs col-sm-3

I have marked with redline you can see the padding.

What I need is as follows (Here I am using it without class hidden-xs col-sm-3)

Image

How can I make I remove the padding which coming due to the addition of hidden-xs col-sm-3? Any help will be appreciated.

Upvotes: 1

Views: 200

Answers (1)

Konrud
Konrud

Reputation: 1114

If i understand your problem right, Try this:

#modest-slider li.col-sm-3 {
 padding-left: 0;
}

Upvotes: 1

Related Questions