Beispiel:
HTML-Code:
<!DOCTYPE HTML>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Justify - Blocksatz</title>
<style type="text/css">
main {
text-align: justify;
width: 90%;
height: 70%;
margin: 0 auto;
}
main:after {
content: "";
display: inline-block;
padding-left: 100%;
visibility: hidden;
}
section.square {
padding: 10px;
width: 300px;
height: 300px;
border: 1px solid red;
display: inline-block;
}
</style>
</head>
<body>
<main>
<section class="square">
<p>section 1</p>
</section>
<section class="square">
<p>section 2</p>
</section>
<section class="square">
<p>section 3</p>
</section>
<section class="square">
<p>section 4</p>
</section>
<section class="square">
<p>section 5</p>
</section>
<section class="square">
<p>section 6</p>
</section>
</section>
</body>
</html>