Pen Settings

HTML

CSS

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

JavaScript

Babel is required to process package imports. If you need a different preprocessor remove all packages first.

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

Behavior

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.

HTML

              
                <html>

<head>

  <title>Tribute to Stephen King
  </title>
</head>


<body>
  <div class="container">


    <h2 class="text-center" "monospace">THIS IS NOT THE<br/>GREATEST PAGE<br/>IN THE WORLD,<br/>THIS IS JUST A<br/>TRIBUTE<br/>to</h2>
    <h1 class="text-center" "red-text" "grey-background"><em>STEPHEN KING</em></h1>
    <center><img id="img1" src="http://assets.rollingstone.com/assets/2016/article/stephen-king-on-dark-tower-movie-its-likely-to-happen-20160209/227490/large_rect/1454973687/1401x788-Stephen-King-by--Shane-Leonard.JPG" style="width:300px;height:200px;"></center>
    <br/><br/>
    <p id="p1" class="text-center">"Monsters are real, and ghosts are real too. They<br/> live inside us, and sometimes, they win."</p>
    <h4 class="text-center" "underline">A Breif history.</h4>
    <div class="row">
      <div class="col-md-6">


      <ul>


        <li> Born Stephen Edwin King September 21st 1947<br/>to parents, Donald Edwin King and Nellie ruth.</li> <img src="http://www.freeiconspng.com/uploads/book-icon-by-sonoftroll-26.png" style="height: 25px;" "width: 25px;">

        <li>Graduated from Maine university with a Batchelor<br/> of Arts degree in 1970 the same year his daughter<br/> Naomi was born.</li> <img src="http://www.freeiconspng.com/uploads/book-icon-by-sonoftroll-26.png" style="height: 25px;"
          "width: 25px;">
        <li>In 1971 he married Tabitha and<br/> they are still married today.</li> <img src="http://www.freeiconspng.com/uploads/book-icon-by-sonoftroll-26.png" style="height: 25px;" "width: 25px;">
        <li>His first novel was published in 1973 after<br/>initially throwing it in the bin but his<br/>wife found it and encouraged him to continue<br/>working on it,the paperback rights eventually,<br/> earned him $400,000 after his initial advance of
          <br/>$2,500
        </li>


        <img src="http://www.freeiconspng.com/uploads/book-icon-by-sonoftroll-26.png" style="height: 25px;" "width: 25px;">
        <li>In the late 1970's King started work on <br/>what would turn out to be his magnum opus,"The Dark Tower",<br/>the tale of Roland the gunslinger,inspired by<br/> a poem by Robert Browning <a href="http://stephenking.com/darktower/misc/robert_browning_s_childe_roland_to_the_dark_tower_came.html">'Roland to the dark tower came'</a><br/>Spanning
          seven books and twenty-seven years it is now being turned <br/>into a much anticipated hollywood movie.</li> <img src="http://www.freeiconspng.com/uploads/book-icon-by-sonoftroll-26.png" style="height: 25px;" "width: 25px;">
        <li>June 19,1999 King was run over by a van while<br/>taking a walk,he suffered a collapsed lung,<br/>multiple fractures to his right leg,a cut to the head<br/>and a broken hip.In 2002 he announced his retirement <br/>thought to be caused by frustration
          with his injuries which<br/> made sitting uncomfortable and reduced his stamina.</li> <img src="http://www.freeiconspng.com/uploads/book-icon-by-sonoftroll-26.png" style="height: 25px;" "width: 25px;">
        <li>Since 2002 King has released at least<br/>seventeen novels and is now the 20th biggest <br/>selling author of all time with approximately 350 million sales<br/> worldwide.
        </li> <img src="http://www.freeiconspng.com/uploads/book-icon-by-sonoftroll-26.png" style="height: 25px;" "width: 25px;">
      </ul>
    </div>
  </div>
  <p id="p2"> If you are interested in learning more about Mr.King then check out his <a href="https://en.m.wikipedia.org/wiki/Stephen_King">wiki</a> page.
    <p>

      <P>Written and coded by David Lecount for FreeCode Camp challenge.</p>


</body>

</html>
              
            
!

CSS

              
                 body {
   background-color: lightblue;
   text-align: center;
 }
 
 h1 {
   color: red;
   text-align: center;
   background-color: black;
   font-size: 50px
 }
 
 h2 {
   text-align: center;
   font-family: monospace;
 }
 
 #p1 {
   font-size: 30px;
 }
 
 #img1 {
   padding: 3px;
   border: 5px solid black;
 }
 
 h4 {
   text-align: center;
   text-decoration: underline;
 }
 
 ul {
   list-style-type: none;border-style:double; 5px;
 }
il{margin:right;}
 #p2 {
   text-align: center;
   font-size: 20px;
 }
              
            
!

JS

              
                
              
            
!
999px

Console