Textauszug ohne Zeilenumbruch korrekt formatieren
Tobias S.
- css
Hallo zusammen!
Ich suche nach einer Möglichkeit, um eine Textauswahl zu formatieren, ohne dass der Textfluss gestört und die Formatangaben dennoch ansehnlich und korrekt dargestellt werden.
Im Detail:
Ich möchte einen beliebig großen Auszug aus einem beliebig umfangreichen Text mittels <div> oder <span> und einigen CSS-Angaben formatieren. Um den Textfluss nicht zu stören arbeite ich mit Inline-Elementen. Also mit <span> oder mit <div style='display:inline'>. Was bei einfachen Formatangaben wie dem Fett- oder Kursivdruck gut funktioniert, sieht beim Definieren einer Hintergrundfarbe und eines Rahmens unansehnlich aus:
Text_davor
<span style='background-color:yellow;border:1px solid red'>Text_auswahl</span>
Text_danach
Denn: Erstreckt sich "Text_auswahl" über mehrere Zeilen, dann wird der Rahmen um jede einzelne Zeile gelegt. Verwende ich statt <span> ein <div>, so legt sich zwar der Rahmen um den kompletten selektierten Text. Allerdings erfolgt dann (natürlich) vor und nach dem <div> ein Zeilenumbruch, was den Textfluss stört.
Wie schaffe ich es also, einen formatierten Block so in den Text zu integrieren, dass kein Zeilenumbruch erfolgt, und dass die Formatierung dennoch als Block ausgegeben wird?
Viele Grüße,
Tobias
evtl. hilft dir display:inline-block
evtl. hilft dir display:inline-block
Vielen Dank! Das ist genau das was ich gesucht habe. Allerdings steht display:inline-block erst ab CSS2.1 zur Verfügung und wird von den meisten Browsern noch nicht unterstützt. Besteht vielleicht die Möglichkeit diese Funktionalität auf Umwegen zu realisieren?