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


Babel includes JSX processing.

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


Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.


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.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.


                <div class="container">
  <div class="row">
    <div class="col-sm-12">
      <div class="panel panel-info">
        <div class="panel-heading">
          <h2>Katherine Johnson</h2>
          <h3>Brilliant Mathematician, Space Cadet</h3>
        <div class="panel-image">
          <img src="" class="img-responsive center-block">
        <div class="panel-body">
          <p>Little was known about Katherine Johnson in the media when she was selected to receive the nation’s highest civilian honor, the National Medal of Freedom on November 24, 2015. When we think of space explorations, we tend to gravitate towards Astronauts in counting our nation's heroes. Much is to be learned from the mathematicians in the early space era circa the 1930s-1970s. Known as "computers" before actual PCs and electronic gadgets entered the scene in the 1960s, mathematicians had the difficult task of computing the main algorithms that made trajectories efficient.  Today, we tribute mathematician Katherine Johnson.</p>
          <h5>Johnson's Early Education</h5>
          <p>Born in 1918, Johnson became a research mathematician due to her fascination with numbers.   She states, “I counted everything. I counted the steps to the road, the steps up to church, the number of dishes and silverware I washed…anything that could be counted, I did.”</p>
          <p>Considered a child prodigy, Johnson started high school at just 10 years old.  Her parents were highly invested in her education, driving her to school up to 120 miles so she could continue her studies.  She soon completed high school and went on to graduate college at 18.</p>
          <p>Johnson was a wife, mother, and a school teacher when she decided to begin working with the National Advisory Committee for Aeronautics.  NACA was the predecessor to NASA, recruiting women for tedious work such as measuring, calculating, and steering unit tests that many of us today use a computer for.  Due to demand for mathematicians, openings for African Americans at Langley Research Center’s Guidance and Navigation Department were made, where Johnson became employed at in 1953.</p>
          <h5>Johnson's Math Career with NASA</h5>
          <p>Johnson was known for her accuracy in computerized celestial navigation.  She calculated the trajectory for Alan Shepard, who became the first American in space, in the Project Mercury mission.  She also went on to work with John Glen on the Friendship 7 mission.  Johnson’s calculations proved to be a critical part of the 1969 Apollo 11 Moon flight and landing expedition as well as the start of the Space Shuttle program.  Johnson worked with NASA until 1986.</p>
          <h5>Johnson's Achievements</h5>
          <p>Johnson’s achievements also include co-authoring 26 scientific papers, earning honorary doctorates from Old Dominion University, Capitol College, and SUNY Farmingdale, receiving the 1967 Lunar Orbiter Spacecraft and Operations Team award, receiving the 1967 Apollo Group Achievement Award, and earning the NASA Langley Research Center Special Achievement Award  five times over the course of her career.</p>
          <p>To learn more about Katherine Johnson, visit NASA's page on her research and work <a href="">here.</a></p>
        </div><!-- end of panel body -->
      </div><!-- end of panel -->
    </div><!-- end of column -->
  </div><!-- end of row -->
</div><!-- end of container -->


                .container {
  background-color: #3399ff;
.panel-image img {
  border: 8px solid #3399ff;
  margin-top: 20px;
  padding: 10px;
.panel-info {
  background-color: #cce6ff;
.panel-heading h2, .panel-heading h3 {
  color: #fff;
  text-align: center;
.panel-info > .panel-heading {
  background-color: #3399ff;
.panel-body {
  background-color: #
hr {
  border-top: 1px solid #3399ff;