JSFiddle - React, Tailwind, and code Playground

by basti1012

HTML

<!DOCTYPE html> 
<html lang="en">
<head>
<meta charset="utf-8">
<title>Homepage</title>
 
 <link rel="stylesheet" type="text/css" href="hier kommt der pfad oder link zur css datei rein">

 </head>
 <body>
 

<script src="Hier kommt der pfad oder link zum javascript rein"></script>
<div id="wrapper">
    <header>Kopfzeile</header>
          <nav >Navigation</nav>
    <div id="mehrspaltig">

        <article>Inhalt</article>
        <aside>Zusatz</aside>
    </div>
<footer>
    <div id="foot_left">links</div>
    <div id="foot_right"><div class="clock">
    
    </div></div>
    </footer>
</div>
 </body>
 </html>

CSS

html, body {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}
#wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 100%;
}
header { 
background-color: deepskyblue;
margin:6px;
}
#mehrspaltig {
 
   flex: 1; 
   display: flex; 
   margin:0 6px 0 6px;
   flex-direction: row; }
    nav { 
    background-color: darkgray;  
    margin:0 6px  6px 6px;
    }
    article { 
    background-color: orange; 
    margin-right:6px;
    flex: 5;
    }
    aside { 
    background-color: gray; 
   
    flex: 1;}
footer { 


display:flex;
 justify-content:center;
 margin:6px;
 justify-content:space-between;

}
#foot_left{
  background:green;
 
  flex:5;
}
#foot_right{
  background:green;
 flex:1;
}

JavaScript

function clock() {// We create a new Date object and assign it to a variable called "time".
var time = new Date(),
    
    // Access the "getHours" method on the Date object with the dot accessor.
    hours = time.getHours(),
    
    // Access the "getMinutes" method with the dot accessor.
    minutes = time.getMinutes(),
    
    
    seconds = time.getSeconds();

document.querySelectorAll('.clock')[0].innerHTML = harold(hours) + ":" + harold(minutes) + ":" + harold(seconds);
  
  function harold(standIn) {
    if (standIn < 10) {
      standIn = '0' + standIn
    }
    return standIn;
  }
}
setInterval(clock, 1000);