Florian Janßen

Beim Gestalten eines 3 Zeiligen Logos bin ich über das Problem gestolpert, einen einzige Zeile in Blocksatz bringen zu wollen. Leider brachte mich die CSS Anweisung ›text-align:justify;‹ oder auch ›text-align-last:justify;‹ nicht weiter. Doch zum Glück bin ich über die „Ben Justification“ gestolpert. Leider hatte sie den Nachteil, dass die Zeile weit über die Begrenzungen des umschließenden div-Kontainers hinausragt. Man sieht es zwar nicht, ist aber trotzdem ärgerlich.

Daher habe ich ein paar kleine Änderungen vorgenommen:

• statt ›id‹s verwende ich ›class‹, sie dürfen mehrfach in einer Seite vorkommen, ›id‹s nur einmal.
• im umschließenden Element setze ich den Überlauf auf ›hidden‹.
• im CSS spreche ich die Funktion allgemein an, so kann sie in verschiedenen Elementen vorkommen.

im html:
<div class="blocksatz">
Eine Zeile im Blocksatz<span> &nbsp;</span>
</div>


im CSS:
.blocksatz {
border: 1px solid black;
display: block;
height: 1.1em;
line-height: 1.1em;
text-align: justify;
overflow: hidden;
width: 100%;
}
.blocksatz span {
font-size: 0px ;
word-spacing: 1000px;
}

ergibt: