CODEWITHSUNDEEP
csstwitter-bootstrap
4thSpace
4thSpace

Reputation: 44332

Why isn't Bootstrap Jumbotron rendering?

I'm using code from the Jumbotron example: http://getbootstrap.com/components/#jumbotron. The jumbotron corners on my example aren't rounded and the text isn't centered. What am I doing wrong?

<!DOCTYPE html>
<html>

<head>
  <!-- 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>
</head>

<body>
  <div style="width:600px">
    <header class="jumbotron">
      <h1>My Famous Webpage</h1>
    </header>
  </div>
</body>

</html>

https://plnkr.co/edit/62cdPp29PtjfldEbGGra?p=preview

Upvotes: 0

Views: 193

Answers (1)

satya
satya

Reputation: 1185

Please try this:

Put your div inside a div whose class is container.

<div class="container">
<div style="width:600px">
            <header class="jumbotron">
            <h1>My Famous Webpage</h1>
        </header>
        </div>
</div>

Upvotes: 2

Related Questions