Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

You're using npm packages, so we've auto-selected Babel for you here, which we require to process imports and make it all work. If you need to use a different JavaScript preprocessor, remove the packages in the npm tab.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Use npm Packages

We can make npm packages available for you to use in your JavaScript. We use webpack to prepare them and make them available to import. We'll also process your JavaScript with Babel.

⚠️ This feature can only be used by logged in users.

Code Indentation

     

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

HTML Settings

Here you can Sed posuere consectetur est at lobortis. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

            
              <div class="container">
  <div class="jumbotron">
  <div= class="row">
      <div class="col-sm-2">
    </div>
  <div class="col-sm-8">
<div id="header">
<header>
<h1>Beyonc&eacute;</h1>
<h3 id="subtitle"><em>The Greatest Pop Star of All Time</em><h3>
  <img src="https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/beyonce-knowles-performs-onstage-during-2018-coachella-news-photo-946416208-1536950566.jpg" class="img-responsive" alt="Beyonc&eacute; on the Coachella stage with a smoky background" width="960px">
  </header>
  </div><!--Header-->
  <body>
 
    <ul>
      <li><strong>1981</strong> - Born in Houston, Texas to Celestine "Tina" Knowles and Mathew Knowles</li>
      <li><strong>1989</strong> - Beyonce, along with Kelly Rowland and LaTavia Roberson were placed in a musical group called Girl's Tyme</li>
      <li><strong>1995</strong> - Mathew Knowles, Beyonce's father, quit his job to manage Girl's Tyme</li>
      <li><strong>1996</strong> - Beyonce and her groupmates were signed to Columbia Records and changed their name to Destiny's Child</li>
      <li><strong>1997</strong> - Destiny's Child released their major label debut song "Killing Time" on the soundtrack to <em>Men in Black</em></li>
      <li><strong>1998</strong> - Destiny's released their self-titled debut album</li>
      <aside>This album won 3 Soul Train Lady of Soul Awards</aside>
      <li><strong>1999</strong> - Destiny's Child released their second album <em>The Writing's on the Wall</em></li>
      <aside>This album went multi-platinum selling more than 8 million copies worldwide
      <li><strong>2001</strong> - Beyonc&eacute; landed the lead role in the MTV movie <em>Carmen: A Hip-Hopera</em></li>
      <li><strong>2001</strong> - Destiny's Child released their 3rd album <em>Survivor</em></li>
        <aside>This album debuted at number 1 and the title track earned Destiny's Child a Grammy</aside>
      <li><strong>2002</strong> - Beyonc&eacute; continued her movie career as Foxxy Cleopatra in <em>Austin Powers in Goldmember</em></li>
      <li><strong>2003</strong> - Beyonce starred opposite Cuba Gooding Jr in <em>The Fighting Temptations</em></li>
      <li><strong>2003</strong> - Beyonc&eacute; released her first solo album <em>Dangerously in Love</em> then went on the <em>Dangerously in Love Tour</em>
        <aside>This album debuted at number one and earned 5 Grammy awards</aside>
      <li><strong>2004</strong> - Destiny's Child released their final studio album <em>Destiny Fulfilled</em> and went on tour where they announced the end of the group</li>
       <li><strong>2006</strong> - Beyonc&eacute; released her second album <em>B'day</em> which also debuted at number one</li>
       <li><strong>2006</strong> - Beyonc&eacute; was in two major films: <em>Pink Panther</em> and <em>Dreamgirls</em></li>
      <li><strong>2007</strong> - Beyonc&eacute; set out on her first worldwide tour <em>The Beyonc&ecute; Experience</em> where she hit 97 venues, grossed $24 million and held food drives at several of the tour stops in major cities</li>
      <li><strong>2008</strong> - Beyonc&eacute; released her 3rd number 1 album <em>I am... Sasha Fierce</em> and married Jay-Z</li>
      <li><strong>2009</strong> - Beyonce went on her second worldwide tour this time grossing $119.5 million and played Etta James in <em>Cadillac Records</em></li>
      <li><strong>2010</strong> - Beyonc&eacute; performed at Barack Obama's inaugural ball, starred in <em>Obsessed</em> and broke the record for the most Grammy awards won in one night by a female artist</li>
      <li><strong>2011</strong> - Beyonc&eacute; released her 4th consecutive number 1 album <em>4</em>, which would go on to be certified platinum</li>
      <li><strong>2012</strong> - Beyonc&eacute; gave birth to her first child, Blue Ivy Carter</li>
      <li><strong>2013</strong> - Destiny's Child released a compilation album entitled <em>Love Songs</em><br>
        Beyonc&eacute; performed at Super Bowl XLVII<br>
        Beyonc&eacute;'s feature-length documentary <em>Life is but a Dream</em> aired on HBO<br>
        Beyonc&eacute; unexpectedly released her self-titled and fith consecutive number 1 album digitally, including a music video for each track<br>
        Beyonc&eacute embarked on her third world tour <em>The Mrs. Carter World Tour</em>
      </li>
        <li><strong>2014</strong> - Beyonc&eacute; and Jay-Z announced the <em>On the Run Tour</em></li>
        <li><strong>2016</strong> - Beyonc&eacute; released <em>Lemonade</em>, her 6th consecutive number one album which broke several records and won several awards and accolades</li>
      <li><strong>2017</strong> - Beyonc&eacute; gave birth to twins Sir and Rumi Carter</li>
      <li><strong>2018</strong> - Beyonc&eacute; continues to be great and slay us all on a daily basis</li>
      
  </body>
    
    </div><!--col8-->
    <div class="col-sm-2"></div>
    </div><!--jumbotron-->
    </div><!--container-->
  <footer>
    Written and Coded by <a href="kishanadine.com">Kisha Nadine</a>
  </footer>
            
          
!
            
              
.container {
  width: 960px;
  margin: 0 auto;
}
h1 {
  text-align: center;
}
h3 {
  text-align: center;
  margin-bottom: 40px;
}
footer {
  text-align: center;
}
img {
  max-width: 100%;
}
            
          
!
999px
🕑 One or more of the npm packages you are using needs to be built. You're the first person to ever need it! We're building it right now and your preview will start updating again when it's ready.

Console