Hubertus: fließtext - white-space:nowrap?

SELF-Forum

fließtext - white-space:nowrap?

Hubertus
– Informationen zu den Bewertungsregeln

hallo.

Ich bin kein CSS-Experte, also frag' ich mal nach:

Im Folgenden *schnipsel* stehen in Zeile eins die zahlen
1 bis 5, in Zeile zwei die Zahlen 6 bis 10 - ok, soweit..

Nur, wie erreiche ich, dass _kein_ automatischer Zeilenumbruch
(white-space?) auftritt, wenn das browser-fenster kleiner wird..?

(hier ist, was ich meine: http://img105.imageshack.us/img105/3508/kkuyp2.gif )

<html>

<head>

<style type="text/css">
span.t{display:block;float:left;text-align:center;width:20px;background-color:#eee;color:#333;border:1px solid #333;white-space:nowrap;}
</style>

</head>

<body>

<span class="t">1</span>
<span class="t">2</span>
<span class="t">3</span>
<span class="t">4</span>
<span class="t">5</span>

<br/>

<span class="t" style="clear:left;">6</span>
<span class="t">7</span>
<span class="t">8</span>
<span class="t">9</span>
<span class="t">10</span>

</body>

</html>

Grüße,
-hubertus

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. fließtext - white-space:nowrap?

    Cheatah
    – Informationen zu den Bewertungsregeln

    Hi,

    Nur, wie erreiche ich, dass _kein_ automatischer Zeilenumbruch
    (white-space?) auftritt, wenn das browser-fenster kleiner wird..?

    indem das umgebende Element die white-space-Eigenschaft mit hinreichend günstigem Wert erhält.

    <body>
    <span class="t">1</span>

    <body> muss Blocklevel-Elemente enthalten.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. fließtext - white-space:nowrap?

      Hubertus
      – Informationen zu den Bewertungsregeln

      hi,

      indem das umgebende Element die white-space-Eigenschaft mit hinreichend günstigem Wert erhält.

      ..auf css'isch lautet deine - womoeglich richtige - antwort..?

      -h

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. fließtext - white-space:nowrap?

        Benjamin Buxbaum
        – Informationen zu den Bewertungsregeln

        Hi!

        hi,

        indem das umgebende Element die white-space-Eigenschaft mit hinreichend günstigem Wert erhält.

        ..auf css'isch lautet deine - womoeglich richtige - antwort..?

        Momentan versiehst du jeden einzelnen <span> mit white-space:nowrap,was dir nicht den gewünschten Effekt, da das natürlich nur für den Text innerhalb von <span></span> gilt. Du umgibst deine Zahlen also mit einem Block-Element (p, div,...) und weist diesem die entsprechende white-space Eigenschaft zu.

        mfG

        --
        Selfcode: ie:} fl:{ br:> va:) ls:< fo:( rl:? n4:# ss:| de:] js:| ch:? sh:( mo:? zu:)
        "And all those exclamation marks, you notice? Five? A sure sign of someone who wears his underpants on his head."
        (Terry Pratchett)
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

      2. fließtext - white-space:nowrap?

        Cheatah
        – Informationen zu den Bewertungsregeln

        Hi,

        indem das umgebende Element die white-space-Eigenschaft mit hinreichend günstigem Wert erhält.
        ..auf css'isch lautet deine - womoeglich richtige - antwort..?

        auf CSSisch lautet die Antwort: "Sorg erst mal für 'ne passende Struktur, sonst kannst Du mit CSS auch nichts mehr reißen."

        Dein HTML-Code ist nicht nur invalide. Er entspricht auch dann noch nicht Deinen Wünschen, wenn Du Validität herstellst. Du hast (zwei mal) fünf zusammengehörende Elemente - warum sieht man die Zusammengehörigkeit nirgendwo im Code? Die (je) fünf Elemente stellen offenbar eine Liste dar - warum ist nirgendwo ein Listenelement? Aus welcher von der Darstellung zu 100% unabhängigen Erwägung entspringt das <br/>-Element?

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        -Please-Search-Archive-First: Absolutely Yes
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. fließtext - white-space:nowrap?

          Hubertus
          – Informationen zu den Bewertungsregeln

          Dein HTML-Code ist nicht nur invalide.

          Schnipsel, Sohn, Schnipsel.

          warum ist nirgendwo ein Listenelement?

          Weil's keine Liste werden soll.

          Aus welcher von der Darstellung zu 100% unabhängigen Erwägung entspringt das <br/>-Element?

          IE/FF-Konflikte. Wie üblich.

          Zeilenumbruch nach-wie-vor.. auch wenn ein DIV, welches white-space:nowrap; zugeteilt bekommt, vorsetzt..

          Mh, Hm. mh.

          -h

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

          1. fließtext - white-space:nowrap?

            Cheatah
            – Informationen zu den Bewertungsregeln

            Hi,

            Dein HTML-Code ist nicht nur invalide.
            Schnipsel, Sohn, Schnipsel.

            falsch. Richtig wäre:

            <ol>
                <li>Schnipsel</li>
                <li>Sohn</li>
                <li>Schnipsel</li>
            </ol>

            Allerdings verstehe ich den Zusammenhang zwischen meiner Aussage und Deiner Auflistung nicht.

            ;-)

            warum ist nirgendwo ein Listenelement?
            Weil's keine Liste werden soll.

            Sondern?

            Aus welcher von der Darstellung zu 100% unabhängigen Erwägung entspringt das <br/>-Element?
            IE/FF-Konflikte. Wie üblich.

            Hm, ich komme üblicherweise trotzdem ohne <br/> aus (bzw. nur dort, wo tatsächlich Textzeilen beendet werden, wie z.B. bei einem Gedicht).

            Zeilenumbruch nach-wie-vor.. auch wenn ein DIV, welches white-space:nowrap; zugeteilt bekommt, vorsetzt..

            Hat's 'ne für mich erreichbare URL?[1]

            Cheatah

            [1] Sicherheitshalber: Wenn ja, welche, verdammt?! ;-)

            --
            X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
            X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
            X-Will-Answer-Email: No
            X-Please-Search-Archive-First: Absolutely Yes
            Beitrag melden
            –
            Informationen zu den Bewertungsregeln

  2. fließtext - white-space:nowrap?

    Inita
    – Informationen zu den Bewertungsregeln

    hoi,

    du kannst auch width in einem div legen:

    <div style="width:300px">
    <span class="t">1</span>
    <span class="t">2</span>
    <span class="t">3</span>
    <span class="t">4</span>
    <span class="t">5</span>
    </div>

    oder

    ich hab auch ne Beispiel ohne width, ohne tables:

      
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  
"http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<title>BoWa</title>  
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  
<style type="text/css">  
html,body{  
    width:100%;  
    margin:0;  
    padding:0;}  
p{  
 padding:6px 0;  
 margin:0}  
#ib{  
    width:90%;  
    padding:0;  
    margin:0;  
    height:200px;  
    border:1px solid red;  
    display:table;  
 background:#ccc}  
</style>  
</head>  
<body>  
    <div id="ib">  
  <span>  
   <div style="display:table-cell;border:1px solid #F00">  
    <p>box box box box box box box box box box box box inix</p>  
    <p>box box box box box box box box box box box box inix</p>  
    <p>wwwwwwwwwwwwwwwwwwwwwwwwwwww</p>  
   </div>  
   <br />  
   <div style="display:table-cell;white-space:pre;border:1px solid #FF00FF">wwwwwwx wwwwwwwwww  wwwwwwwwwwww wwwwwwww wwwwwwww wwwwww</div>  
   <p>box</p>  
   <p>box</p>  
  
  </span>  
 </div>  
</body>  
</html>
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln