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) Responsive Layouts with the Bootstrap Grid Column Ordering and Offsetting

4 Answers

Renārs Ļubkins
Renārs Ļubkins
22,401 Points

If I get it right. Then You need to change "col-xl-offset-2" to "offset-xl-2" in your div class. If you look in video when Guil is checking documentation and watch it for your self you will notice that bootstrap 4 changed syntax. I hope its helped.

Christopher Collins
seal-mask
.a{fill-rule:evenodd;}techdegree
Christopher Collins
Front End Web Development Techdegree Student 6,343 Points

Hi Carleen,

Could you copy and paste the code for us? The above link is broken. Let us take a look at the markup and see if we can't find you a solution!

Carleen Hall
seal-mask
.a{fill-rule:evenodd;}techdegree
Carleen Hall
Front End Web Development Techdegree Student 3,158 Points

see below. Thanks

          <hr>
<div class="row p-y-2 text-muted">
  <div class="col-md-6 col-xl-5">
    <p><strong>About Treehouse</strong></p>
    <p>Treehouse brings affordable technology education to people everywhere to help them achieve their dreams and change the world.</p>
  </div>
  <div class="col-md-6 col-xl-5 col-xl-offset-2">
    <p><strong>Stay up-to-date on Full Stack Conf</strong></p>
    <div class="input-group">
      <input type="text" class="form-control" placeholder="Email">
      <span class="input-group-btn">
        <button class="btn btn-primary" type="button">Sign up</button>
      </span>
    </div>
  </div>
          ```