CSS: white-space:nowrap überschreiben

[slomoman]

Ich lese 2 Werte aus einer Datenbank, die ich in eine Tabellenzeile schreiben will. Ich will, dass Umbrüche INNERHALB der beiden Werte erlaubt sein sollen, aber nicht ZWISCHEN den beiden Werten.

Ich verwende eine UI-Library, die die Werte in SPAN-Tag mit einigen CSS-Klassen verwandelt, worauf ich keinen Einfluss habe. Dummerweise sorgen diese Klassen (die ich nicht kenne) dafür, dass zwischen die beiden Werte immer ein Umbruch gemacht wird.

Nun habe ich versucht, um die Werte ein "<DIV style ="white-space:nowrap;"> gebaut, was diesen Umbruch entfernt hat.

Das Problem: Jetzt sind bei langen Texten auch die Umbrüche INNERHALB der Werte weg.

Folglich habe ich versucht, die DIVS zu verschachteln (s.u.). Leider werden auch bei verschachtelten DIVS keine Umbrüche zugelassen. Gibt es da eine Möglichkeit, dass nowrap des außeren DIVS irgendwie zu überschreiben?

<div style = "white-space:nowrap;">

  <div style = "white-space:normal;">

     <span class = "kann ich nicht beeinflussen">

       Wert 1. Hier sollen Umbrüche erlaubt sein, sind sie aber nicht!

      </span>

  </div>

  <!-- hier soll kein Umbruch erlaubt sein -->

  <div style = "white-space:normal;">

     <span class = "kann ich nicht beeinflussen">

       Wert 2

      </span>

  </div>

</div>

[Sigi]

Mit nem Firefoxplugin(webdeveloper) kannst du sehen welche Klassen auf dein Element greifen und wie sie heißen. Zudem must du ja wissen wie die Klassen heißen und könntest doch die Klasse erweitern?

zudem wieso passt du die Daten aus der DB nicht mit Tags an? Logisch gesehen willst du sie ja in html ausgeben also würd ich die \r\n durch <br/> eben ersetzten.

[geloescht_JesterDay]

Ein Div ist standardmäßig ein Block-Element. Das bedeutet, nach einen Div folgt ein Zeilenumbruch. Da kannst du auch nix gegen machen, außer du läßt das zweite Div links floaten. Im Gegensatz dazu ist ein Span standardmäßig immer ein Inline-Element. Das bedeutet, dass es innerhalb einer Zeile ist und keinen Zeilenumbruch verursacht. Gleichzeitig sind aber auch Dinge wir Breite oder Höhe etc. nicht einstellbar.

Beeinflussen kannst du dieses Standardverhalten mit { display: inline|block; }

Eine Kombination aus diesen beiden ist der Inline-Block. Leider unterstützt das, außer Opera, noch kein Browser.

Also: Deine white-space: nowrap zwischen den Divs kannst du vergessen. Einzige Möglichkeit ist { float: left } für das zweite Div. Das verursacht aber u.U. wieder andere Probleme. Kenne dein komplettes Layout ja nicht.