I am trying to test bootstrap in codepen. Right now the class=“row” is not working and the twitter, tumbler and new quote are not on the same line. Does anyone have advice on the script or stylesheet that I need in the head to call bootstrap in codepen (assuming I am using the divs correctly). This does not seem to be working:
<HTML lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>FCC : Random Quote Machine</title>
<link rel="stylesheet" media="screen" href="https://cpwebassets.codepen.io/assets/fullpage/fullpage-1580f96ce81ff0a427cf57dda2748ce646c38efc201ae5942a29958cffa6856d.css">
<link rel="stylesheet" media="all" href="https://cpwebassets.codepen.io/assets/global/global-13b6426431ed0f511a5f146fedda1389eb9eabcb17a1aee8bde0db5f7aa8b923.css">
<link rel="stylesheet" media="screen" href="https://cpwebassets.codepen.io/assets/packs/css/everypage-bc120a53.css">
<link rel="stylesheet" media="all" href="https://cpwebassets.codepen.io/assets/page/page-f19203c8fe65f7537f749457302a72522949afc3526cf238841f52afebabd5fa.css">
<link rel="stylesheet" media="all" href="https://cpwebassets.codepen.io/assets/editor/editor-9ec1239896c38e8af5e2c952d80a98c0bc83d9d805bf69d553a20e8689051f73.css">
<link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"
/> <!--add font-awesome-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"/> <!--add bootstrap-->
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script><!--Hamburger bar popout test module-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js"></script>
</head>
<body>
<div id="quote-box">
<p id="text">
Quotes will go here.
</p>
<p id="author">
Author's name
</p>
<div class="row">
<div class="col-xs-1">
<div class="buttons">
<a class="button" id="tweet-quote" title="Tweet this quote!" target="_blank" href="https://twitter.com/intent/tweet?hashtags=quotes&related=freecodecamp&text=%22Life%20is%20not%20measured%20by%20the%20number%20of%20breaths%20we%20take%2C%20but%20by%20the%20moments%20that%20take%20our%20breath%20away.%22%20Maya%20Angelou" style="background-color: rgb(119, 177, 169);">
<i class="fa fa-twitter"></i>
</a>
</div>
<div class="col-xs-1">
<a class="button" id="tumblr-quote" title="Post this quote on tumblr!" target="_blank" href="https://www.tumblr.com/widgets/share/tool?posttype=quote&tags=quotes,freecodecamp&caption=Maya%20Angelou&content=Life%20is%20not%20measured%20by%20the%20number%20of%20breaths%20we%20take%2C%20but%20by%20the%20moments%20that%20take%20our%20breath%20away.&canonicalUrl=https%3A%2F%2Fwww.tumblr.com%2Fbuttons&shareSource=tumblr_share_button" style="background-color: rgb(119, 177, 169);">
<i class="fa fa-tumblr"></i>
</a>
</div>
<div class="col-xs-8">
</div>
<div class="col-xs-2">
<button class="button" id="new-quote" style="background-color: rgb(119, 177, 169);">New quote</button>
</div>
</div>
</div>
<img id="tweet-quote"></img>
</div>
</body>
</HTML>
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36
Challenge: Front End Development Libraries Projects - Build a Random Quote Machine
Link to the challenge: