Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>correction</title>
</head>
<body>
    <header> Entête logo
    <nav>
<a href="#">Cours</a>
<a href="#">TD</a>
<a href="#">TP</a>
<a href="#">Projets</a>
  </nav>
</header>
  <section>
  <nav>
Menu 
  </nav>
    <article>Contenu
 </article>
    <section>
  
</body>
</html>
 
html, body {
   height : 100%;
}
body > section {
 display: flex;    
 height : 100%;
}
body > * {
  padding : 1em;
}
header {
  
}
article {
  flex : 8;
}
nav {
  flex : 1;
}
header {
  text-align : center
}
article {
  background: red;
}
body > section > nav {
  background: gold;
}
header > nav {
  display: flex;
}
header > nav > a {
  border : solid 1px;
  padding: 15px;
  margin: auto 10px;
  text-decoration: none;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  
  text-align: center;
  flex : 1;
}
nav > a:first-child {
 margin-left: 0;
}
nav > a:last-child {
  margin-right: 0;
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
dupontpro
0viewers