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) Getting to Know Bootstrap 4 Creating a Simple Page

heather918
heather918
6,375 Points

Input is centered, but H1 and P tags are not. Font style/size is also not identical to video.

<!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags must come first in the head; any other head content must come after these tags --> <title>Full Stack Conf</title>

<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->

</head> <body>

<div class="container text-xs-center">
  <h1 class="display-1">Full Stack Conf</h1>
  <p class="lead">Coming soon!</p>

    <div class="col-lg-6 col-lg-offset-3">
      <div class="input-group">
        <input type="text" class="form-control" placeholder="Enter your email for info.">
        <span class="input-group-btn">
          <button class="btn btn-secondary" type="button">Sign Up!</button>
        </span>
      </div>
    </div>
 </div>

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>

</body> </html>

heather918
heather918
6,375 Points

Thank you Gregory. I hadn't realized I was using the wrong version. After following Guil's URL in an earlier video I was able to modify my starter template, and everything is working properly now. Thanks again!

mohammed abdi abdulahi warsame
mohammed abdi abdulahi warsame
4,926 Points

can anyone help!! i dont know where iam getting it wrong, but the class is not working for me

mohammed abdi abdulahi warsame
mohammed abdi abdulahi warsame
4,926 Points

can anyone help!! i dont know where iam getting it wrong, but the class is not working for me

1 Answer

Gregory Ledger
Gregory Ledger
6,116 Points

"text-xs-center" is for version 4. "text-center" is for version 3.