JSFiddle

  • HTML DOC Template

    No-Library (pure JS), HTML, CSS, JavaScript

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="utf-8" />
      <title>Your document title here</title>
      <link rel="stylesheet" type="text/css" href="css/normalize.css">
      <link rel="stylesheet" type="text/css" href="css/style.css">
    </head>
    <body>
    ....[your page contents]...
      <script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
      <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js">		</script>
    </body>
    </html>
  • Flexbox Fun

    Understanding the flexbox

    <div class="body-wrap clearfix">
      <body>
       
        <div class="header-wrap">
          <header>
            <h1>Making sense out of the Flexbox Model</h1>
          </header>
        </div>
    
          <div class="main-body-wrap">
            <div class="main-content-wrap clearfix">
                  <div class="col column-1">
                    <div class="item">.item</div>
                    <div class="item">.item</div>
                    <div class="item">.item</div>
                  </div>
                  <div class="col column-2">
                    <code>.item {<br>
                            width: 50px;<br>
                            height: 50px;<br>
                            background-color: #046380;<br> 
                            margin: 10px;<br>
                            color ...</code></div></div></div></body></div>