CSS - display: inline-block

css-display-inline-block.md

html

<section>
    <article>
        <h2>un h2</h2>
        <p> un paragraph un paragraph un paragraph un paragraph</p>
    </article>
    <article>
        <h2>un h2</h2>
        <p>un paragraph</p>
    </article>
    <article>
        <h2>un h2</h2>
        <p>un paragraph</p>
    </article>
    <article>
        <h2>un h2</h2>
        <p>un paragraph</p>
    </article>
</section>

css

section {
    font-size: 0.1px; /* IE 9/10 don't like font-size: 0; */
}
article {
    width: 25%;
    display: inline-block;
    text-align: justify;
    font-size: 1rem;
    vertical-align: top;    
}
article:after {
  content: '';
  width: 100%; /* Ensures there are at least 2 lines of text, so justification works */
  display: inline-block;
}