Zeilenumbruch

Diskutiere Zeilenumbruch im CSS Forum im Bereich Programmierung; Hallo. Ich bekomme einen Zeilenumbruch, wo ich eigentlich keinen haben will und auch keinen erwarte. Folgende CSS Class-Definitionen habe ich...
  • Zeilenumbruch Beitrag #1
M
MaWe
Member
Beiträge
22
Punkte Reaktionen
0
Hallo.

Ich bekomme einen Zeilenumbruch, wo ich eigentlich keinen haben will und auch keinen erwarte.

Folgende CSS Class-Definitionen habe ich.
Einmal CONTENT und einmal CONTENTREDBOLD
Code:
.content {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12pt;
 font-style: normal;
 line-height: 18pt;
 font-weight: normal;
 font-variant: normal;
 text-transform: none;
 text-decoration: none;
 color: #008000;
}
.contentredbold {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12pt;
 font-style: normal;
 line-height: 20pt;
 font-weight: bold;
 font-variant: normal;
 text-transform: none;
 text-decoration: none;
 color: #FF0000;
}

Wenn ich dann folgende Tabellenzeile in HTML definiere,
HTML:
    <tr class="content">
      <td>Dies ist normaler Text (content), <div class="contentredbold">dies ist roter Text (contentredbold)</div> und dieser wieder normal
      </td>
    </tr>
so habe ich 2 Zeilenumbrüche darin, die ich gar nicht haben will:
Dies ist normaler Text (content),
dies ist roter Text (contentredbold)
und dieser wieder normal.

Wie kann ich den Zeilenumbruch direkt vor und nach dem <div> vermeiden ?

Viele Grüße
MaWe
 
  • Zeilenumbruch Beitrag #2
developr
developr
Teammitglied
Beiträge
336
Punkte Reaktionen
0
Du musst die CSS-Angaben um white-space:nowrap; ergänzen oder den nowrap-Tag direkt in die Tabelle schreiben (<td nowrap="nowrap">...).
 
  • Zeilenumbruch Beitrag #3
M
MaWe
Member
Beiträge
22
Punkte Reaktionen
0
Ich hab die Tabellenzeile jetzt folgendermassen definiert:

HTML:
    <tr class="content">
      <td nowrap="nowrap">Dies ist normaler Text (content), <div class="contentredbold">dies ist roter Text (contentredbold)</div> und dieser wieder normal
      </td>
    </tr>

Trotzdem bringt er mir zwei Zeilenumbrüche.

Gibt es irgendein Tag, der dieses nowrap 'überlagert' ?

Gruß
MaWE
 
  • Zeilenumbruch Beitrag #4
developr
developr
Teammitglied
Beiträge
336
Punkte Reaktionen
0
Ah... das kommt wegen dem DIV. Wenn du nur einen Bereich eines Textes formatieren möchtest, benutzte <span>.

HTML:
<tr class="content">
      <td nowrap="nowrap">Dies ist normaler Text (content), <span class="contentredbold">dies ist roter Text (contentredbold)</span> und dieser wieder normal
      </td>
    </tr>
 
  • Zeilenumbruch Beitrag #5
M
MaWe
Member
Beiträge
22
Punkte Reaktionen
0
Klasse.

Mit <span> klappt es. Da brauche ich dann auch gar kein 'nowrap' mehr.

Habe bisher immer nur mit <div> statt <span> gearbeitet.
Div generiert anscheinend immer Zeilenumbruch, span nicht.
Wann sollte man denn div und wann eher span nehmen ?
Bin noch Anfänger und für jeden Tipp bzw. Erfahrung dankbar.

Vielen Dank nochmals.
Gruss
MaWe
 
  • Zeilenumbruch Beitrag #6
developr
developr
Teammitglied
Beiträge
336
Punkte Reaktionen
0
Span nimmt man immer, um Bereiche im Text zu formatieren. Das Div nutzt man dann für die Positionierung von jeglichen Elementen.

HTML:
<div style="border: 1px solid red;padding:10px;margin-top:100px;">Dieses Wort sollte <span style="color:red">rot</span> erscheinen und außerhalb des Textes ist ein Rahmen.</div>
 
Thema:

Zeilenumbruch

Oben Unten