Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Bootstrap 4 Basics (Retired) Using Bootstrap Components Using Jumbotron to Showcase Key Content

Posted by Bhrugen Patel
Bhrugen Patel
Courses Plus Student 991 Points

my jumbotron is not getting full width

I am using jumbotron-fluid but i am still not getting full width. I am getting same width as where my text wraps to in container.

        <div class="jumbotron jumbotron- bg-info text-white text-sm-center">
            <div class="container pt-3">
                <h1 class="display-2">Bootstrap Project</h1>
                <p class="lead">This is a modified jumbotron that occupies the entire horizontal space of its parent.</p>
            </div>
        </div>

1 Answer

nico dev
nico dev
20,364 Points
nico dev
nico dev
20,364 Points

I know that:

  1. It is probably already too late.
  2. You probably figured it out on your own by now.

But still, just in case:

You forgot to add the "fluid" bit after the "jumbotron-".

That should do it.

NOTE: Remember changing the pt-3 to pt-5 (as per the new Bootstrap values for padding and margin).