CODEWITHSUNDEEP
htmlasp.nettwitter-bootstrap
AXGuy
AXGuy

Reputation: 335

bootstrap jumbotron full width image

I have a cover on all pages.. I am using jumbotron to have a full width image. but it leaves a space on right and left side. I added margin-left so the blank space on left was gone but the right one is still there. Also when I resize the browser there is a very large space on the right side.

<div id="cover-success" class="jumbotron">
   <div class="container">
        <div class="overlay">
            <div class="text-center">
                <h1>Success Stories</h1>
                <h2>Here are some of the many resolved complaints.</h2>
            </div>
        </div>
    </div>
</div>

CSS used:

#cover-success.jumbotron {
background-size: cover;
background-image: url('Images/cover-success-stories.jpg');
 position:absolute;
width:100%;
margin-top: -14px;
margin-left: -70px;
margin-right:-50px;
height: 270px;
}

Upvotes: 1

Views: 708

Answers (1)

ScaisEdge
ScaisEdge

Reputation: 133370

Try for padding too

 #cover-success.jumbotron {
 background-size: cover;
 background-image: url('Images/cover-success-stories.jpg');
 position:absolute;
 width:100%;
 margin: 0px;
 padding: 0px;
 height: 270px;
 }

Upvotes: 2

Related Questions