hansW: Zelle mit ein oder zwei Textzeilen

Hallo.

Folgendes muß ich gelöst bekommen:
das Feld xxx wird durch ein Skript befüllt, mal ein paar Lettern, mal mehr, sodaß entsprechend der Div-Breite der Inhalt zweizeilig dargestellt werden muß

Wie ist es zu lösen, daß der gesamte 2te Span ob 1- oder 2-zeilig immer mittig nach dem vorhergehenden span-Element dargestellt wird???

  
<div style="width:300px;">  
                <span style="float:left;height:18px;width:100px;margin:3px 3px 0px 0px;">yyy</span>  
		<span style="height:auto;float:left;width:170px;font-size:10px;" alt="{xxx_}" title="{xxx_}">{xxx_}</span>				  
	</div>  

evtl per align=absMiddle ... aber wie?? bekomme es nicht hin.

  1. Om nah hoo pez nyeetz, hansW!

    <div style="width:300px;">
                    <span style="float:left;height:18px;width:100px;margin:3px 3px 0px 0px;">yyy</span>
    <span style="height:auto;float:left;width:170px;font-size:10px;" alt="{xxx_}" title="{xxx_}">{xxx_}</span>
    </div>

      
    Was soll das float? Warum inline-style-Angaben? Warum feste Breiten? Warum hat das zweite span ein alt-Attribut?  
      
    ~~~html
    <div>  
      <span></span>  
      <span></span>  
    </div>
    
    div span + span {  
      display: block;  /* sorgt für eine neue Zeile */  
      text-align: center;  
    }
    

    Matthias

    --
    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Mars und Marshmallow.

    1. Hi Matthias.

      Für dich ein Schock und trotzdem hast Dich zu ner Antwort hinreissen lassen...toll!!
      Vielen Dank!!

      hansW

      1. Hallo nochmal.

        Ich bekomme das damit nicht hin: Sobald ein neues Wort beginnt, schreibt er damit in die zweite Zeile.

        Also nochmal die Fragestellung:

        -Ein umschließendes div
        -zwei hintereinander liegende spans
        -der erste ist mit einem Wort befüllt und soll einfach v-aligned gesetzt sein
        -der zweite wird per Skript befüllt, mit 2, 4  oder 9 oder so Worten

        Da der Platz im div nicht ausreicht, damit in span2 mehr als 3 Worte untgebracht werden, muß dann in zwei Zeilen geschrieben werden. Wie richtet man den zweiten span v-mittig nach dem ersten aus, daß er für beide Fälle, 1zeilig und 2zeilig, richtig sitzt???

        Analog zu span, danach <img align=absmiddle>

        Meine letzte verzweifelte Version, die zwar 2zeilig funktioniert, 1zeilig aber einen höhergestellten 2ten span liefert

          
        <div style="MAX-HEIGHT: 35px; WIDTH: 150px">  
        <div style=" MAX-WIDTH: 110px; HEIGHT: 35px; FLOAT: left; WIDTH: 110px">  
        <span style="VERTICAL-ALIGN: middle">Hnunuinau</span>  
        </div>  
        <div style="MAX-WIDTH: 40px; HEIGHT: 35px; FLOAT: right; WIDTH: 40px">  
        <span style="FONT-SIZE: 8px; VERTICAL-ALIGN: middle; FLOAT: right; WIDTH: 40px"  
        align="absMiddle">iuiuhio</span>  
        </div>  
        </div>  
        
        

        PLZ help!!!!!!!!!!!

        1. Om nah hoo pez nyeetz, hansW!

          Hallo nochmal.

          Ich bekomme das damit nicht hin: Sobald ein neues Wort beginnt, schreibt er damit in die zweite Zeile.

          In der ersten Zeile steht also ein einzelnes Wort linksbündig.
          Dann kommt eine zweite Zeile, die horizontal zentriert sein soll und ggf. auch noch eine 3. Zeile benötigt.

          Dieser komplette Inhalt soll vertikal zentriert werden.

          Habe ich das richtig verstanden?

          Analog zu span, danach <img align=absmiddle>

          align ist ein veraltetes Attribut und absmiddle ist mir unbekannt.

          PLZ help!!!!!!!!!!!

          Deine Tastatur ist kaputt.

          Kannst du auch meine Fragen beantworten (Float, …)?

          Matthias

          --
          Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Rind und Rindenmulch.

          1. So soll das aussehen:
            Links 2zeilige Variante, rechts 1zeilig.
            http://www.img-host.de/bild.php/45854,rect644578ZRZAN.png

            Feste Breiten:
            -Umschließendes div, grau
            -span im linken lila div, damit auch der lila div links
            -->feste Breite des rechten divs

            Aber: Das "float" und auch die Breiten sollen eigentlich nichts, sind lediglich Ausdruck von Planlosigkeit und des Versuchs der Überredung des Browsers anstatt einer Überzeugung. Zufrieden :-)

            img align=absmiddle-->funktioniert wunderbar, zumindest im Fall "thumbnail nach Textzeile"

            1. Om nah hoo pez nyeetz, hansW!

              http://dabblet.com/gist/8728215

              Matthias

              --
              Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Boss und Bossa nova.

              1. Oh!!!

                Very very nice from you!! Mein Ansatz war zwar nicht zielführend, war dafür aber kaum weniger elegant :-)

                Danke vielmals!!! Danke danke!!