1

When using the blockquote class in Bootstrap 4.1.3 the effects are applied except for the sidebar.

Here's how it looks in tutorials: enter image description here

Here's how it looks in my browser (chrome): enter image description here

I've tried it in different browsers, and I couldn't solve it with this post.

Is it just my computer? Is there another css class overriding the sidebar? Thanks for your help. 

<!doctype html>
<html lang="en">
<head>
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

  <!-- Bootstrap CSS -->
  <link 
    rel="stylesheet" 
    href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" 
    integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" 
    crossorigin="anonymous">

  <title>Bootstrap</title>
</head>

<body>
  <div class="container">
    <blockquote class="blockquote">
      <p class="mb-0"> Text for the blockquote. Text for the blockquote.</p>
      <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
    </blockquote> 
  </div>


  <!-- Optional JavaScript -->
  <!-- jQuery first, then Popper.js, then Bootstrap JS -->
  <script 
      src="https://code.jquery.com/jquery-3.3.1.slim.min.js" 
      integrity="sha384- q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
    crossorigin="anonymous">
  </script>

  <script 
    src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" 
    integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" 
    crossorigin="anonymous">
  </script>

  <script 
    src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" 
    integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" 
    crossorigin="anonymous">
  </script>
</body>
</html>
Nitin Bisht
  • 5,053
  • 4
  • 14
  • 26
Lucas
  • 13
  • 5

1 Answers1

0

The post you linked to seems to be encountering this error because he is using a beta version of Bootstrap. Is it the case for you somehow? Have you checked the codepen linked in the post?

Jake
  • 1,398
  • 1
  • 9
  • 19
  • I don't think I'm using the beta version, the link for the stylesheet just says version 4.1.3. And the codepen example in that post doesn't show any sidebars, which makes me think it's my computer but I can't figure out why that is. – Lucas Nov 28 '18 at 00:38
  • It's simply because it is supposed to look like this in 4.1.3 (see here : https://getbootstrap.com/docs/4.1/content/typography/#blockquotes), they must have changed the design and the one in your tutorial is outdated. I hope this helped. Don't forget to mark my answer as the accepted answer if it helped. – Jake Nov 30 '18 at 12:31