algore2001: css Layout bricht beim Vergrößern um

Hallo,

ich bin an folgendem gescheitert:
mein flexibles CSS-Layout bricht beim Vergrößern der Schrift um, obwohl ich gerade dies verhindern sollte. D.h. die mittlere und rechte Spalte rutschen dann in die neue Zeile.

Hat jemand eine Idee woran das liegen könnte?

http://www.englisch-lernen-im-internet.de/selfhtml/remake2.html

Danke und Viele Grüße
algore2001

  1. Hi!

    Hat jemand eine Idee woran das liegen könnte?

    Du hast die Breiten in em angegeben, dadurch verbreitern sie sich natürlich beim Schriftgrad erhöhen. Ich hatte eben sogar eine horizontale Scrollleiste (Opera auf 150% Zoom)-

    http://www.englisch-lernen-im-internet.de/selfhtml/remake2.html

    btw: dein Code ist verbesserungsfähig. Du hast z.B.

        <div id="column-left">  
          <div class="navigation">  
           <ul class="navi-ul">  
            <li><a href="#" title="Link1" class="navi-ul-a"><span class="bullet">&raquo;&nbsp;</span><span class="item">Link1</span></a></li>  
            <li><a href="#" title="Link2" class="navi-ul-a"><span class="bullet">&raquo;&nbsp;</span><span class="item">Link2</span></a></li>  
            <li><a href="#" title="Link3" class="navi-ul-a"><span class="bullet">&raquo;&nbsp;</span><span class="item">Link3</span></a></li>  
            <li><a href="#" title="Link4" class="navi-ul-a"><span class="bullet">&raquo;&nbsp;</span><span class="item">Link4</span></a></li>  
           </ul>  
          </div>  
        </div>
    

    mit entsprechenden Styleangaben. DAs ganze könntest du folgendermassen kürzen:

    <ul id="navigation"><!--du wirst ja nur eine Navigation haben, ansonsten verwende class-->  
    <li><a href="#">Link1</a>  
    <li><a href="#">Link2</a>  
    <li><a href="#">Link3</a>  
    <li><a href="#">Link4</a>  
    </ul>
    

    Und das ganze dann per CSS formatieren und positionieren

      
    ul#navigation {/*Positionierung und Foramtierung von ul*/}  
    ul#navigation li {/*Formatierung von li*/}  
    ul#navigation a, ul#navigation a:link {/*Formatierung von a*/}  
    ul#navigation a:visited {/*Formatierung von a:visited*/}
    

    und so weiter...

    Gruß

    Martin

    1. Hallo,

      Danke für die Hilfe.
      Es war beabsichtigt dass beim Vergrößern vertikale Scrollbalken auftauchen. Mein Problem ist das der mittlere und rechte Kasten dabei umbrechen. Ich habe alles mit em gemacht und dann sollte es sich doch so vergrößern, das die Inhalte nicht umbrechen.

      Viele Grüße
      algore2001

      1. Hi,

        Es war beabsichtigt dass beim Vergrößern vertikale Scrollbalken auftauchen. Mein Problem ist das der mittlere und rechte Kasten dabei umbrechen.

        Ich denke, Du willst ein flexibles Layout?

        Ich habe alles mit em gemacht und dann sollte es sich doch so vergrößern, das die Inhalte nicht umbrechen.

        Das ist bei Flexibilität so üblich und gewünscht und das passiert bei Deiner Seite auch bei Verkleinerung des Fensters. Wenn Du - unschöne und weniger Nutzerfreundliche - Scrollbalken willst, dann mußt Du auf die Flexibilität verzichten und dem äußeren Element eine passende Breite geben (wobei der IE dann manchmal dennoch umbricht).

        freundliche Grüße
        Ingo

  2. Hallo,

    mein flexibles CSS-Layout bricht beim Vergrößern der Schrift um, obwohl ich gerade dies verhindern sollte. D.h. die mittlere und rechte Spalte rutschen dann in die neue Zeile.

    Hat jemand eine Idee woran das liegen könnte?

    das ist ja bei float normal.
    Offenbar fehlt noch ein abschliesendes </div>, aber das
    sollte erstmal keinen Einfluss haben; also ggf. absolut
    positionieren statt float. Wie statisch soll denn das
    flexible Layout bei doch eher festen Spaltenbreiten letztlich
    werden?

    Grüsse

    Cyx23