<h1>Alignement breton</h1>
<div id="boutons"><button type="button" id="gauche">Gauche</button>
  <button type="button" id="centre">Centré</button>
  <button type="button" id="droit">Droite</button>
</div>

<div id="conteneur">
  <img src="https://www.logoden-biniou.com/drapeau.jpg" width="80px" id="drapeau">
  <p>Logoden biniou degemer mat an penn ar bed goz, ha mezheven drezomp te kanañ hanter aour drezo amzer, ha Penmarc’h bremañ da tra pla’hig war.
    Ganit torgenn Orient draonienn spontus kontadenn pegoulz tachenn greiz, oaled ziskouez kenavo tu gavr a regiñ eget leun, pesketa ribl livañ kuz’h niz melen fur.
  </p>
  <p>Hent bluenn ebet an kav mignon ouzhoc'h evit a, dre menoz señin eeun ur eta.
    Tec’hout mignon kibellañ ennoc'h ezel barrad don linenn soñj, ivin ganimp, ganeomp sklaer tregont keñver kaozeadenn.</p>
</div>

<p>Texte issu du générateur <a href="https://www.logoden-biniou.com">Logoden biniou</a></p>
#conteneur{
    width:50%;
    border: solid black 1px;
    background-color:cadetblue;
  
    color:white;
    padding:10px;
}
#drapeau{
    margin:10px;
}
#boutons{
  margin:20px;
  text-align:left;
}
button {
  border: 1px solid black;
  color: black;
  font-size: 14px;
  background-color: lightgray;
  padding: 10px 20px;
  cursor: pointer;
}

button:hover {
  background-color: white;
  color: cadetblue;
}
let boutonGauche // à compléter
let boutonCentre // à compléter
let boutonDroite // à compléter

boutonGauche.addEventListener("click", alignerGauche);
boutonDroite.addEventListener("click", alignerDroite);
boutonCentre.addEventListener("click", alignerCentre);

let conteneur = document.querySelector("#conteneur");
function alignerGauche(){
    // à compléter
}

function alignerDroite(){
    // à compléter
}

function alignerCentre(){
   // à compléter
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.