Exemple de la propriété CSS column-rule, ou la largeur du règle est 10px, où le style est "groove" et la couleur est gris

Source Code: (back to article)

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style> 
      div {
      /* Chrome, Safari, Opera */
      -webkit-column-count: 4;
      -webkit-column-gap: 30px;
      -webkit- column-rule: 10px groove #ccc;
      /* Firefox */
      -moz-column-count: 4;
      -moz-column-gap: 30px;
      -moz-column-rule: 10px groove #ccc;
      column-count: 4;
      column-gap: 30px;
      column-rule: 10px groove #ccc;
      }
    </style>
  </head>
  <body>
    <h2>Exemple de column-rule-style</h2>
    <p>Ici column-rule est définie à 10px groove gray.</p>
    <div>
      Lorem Ipsum est simplement un texte factice de l'industrie de l'impression et de la composition. Lorem Ipsum est le texte factice standard de l'industrie depuis les années 1500, quand un imprimeur inconnu a pris une galère de type et l'a brouillé pour en faire un cahier de caractères. Il a survécu non seulement à cinq siècles, mais aussi au saut dans la composition électronique.
    </div>
  </body>
</html>