index.html

<!DOCTYPE html>
<html>
<head>
<style>
* {
    box-sizing: border-box;
}

.col-container {
    display: table;
    width: 100%;
}
.col {
    display: table-cell;
    padding: 16px;
}

@media only screen and (max-width: 600px) {
    .col {
        display: block;
        width: 100%;
    }
}
</style>
</head>
<body>


<div><h2>Bienvenue sur l’intranet
ADM du Lab ASR</h2></div>
<p>J'ai été crée pour etre responsive design malgré mon design très sobre puisque le temps manquait...</p>

<div class="col-container">
  <div class="col" style="background:blue">
    <h2 style="color:white">Hello</h2>
    <p style="color:white">World</p>
  </div>

  <div class="col" style="background:white">
    <h2>Raphael</h2>
    <p>Hello World!</p>
    <p>Hello World!</p>
    <p>Hello World!</p>
    <p>Hello World!</p>
  </div>

  <div class="col" style="background:red">
    <h2 style="color:white">Lorem Ipsum</h2>
    <p style="color:white">texte latin...</p>
    <p style="color:white">encore du texte latin...</p>
  </div>
</div>

</body>
</html>