Andreas Vogt: 2 Divs nebeneinander, einer mit fester Größe

Hallo Forum,
ich habe 2 Div Container, einer mit float left und der andere mit float right. Der 2. Container habe ich auf eine Breite von 20% eingestellt mit einer min-width von 330px.

Jetzt möchte ich den Text im linken Div zentriert darstellen. Das klappt aber nur wenn ich dem div eine Breite gebe. Getestet mit 78% klappt das bei großer Auflösung, wenn ich aber mit z.B. 1024 Pixel Auflösung teste wird das 2. Div in der Zeile darunter angezeigt, weil eben der Platz in der Zeile nicht mehr ausreicht.

Gibt es eine Möglichkeit das 1. Div in einer Breite von 100%-350px anzuzeigen? Eventuell per JavaScript?

Gruß Andreas

  1. Hallo Andreas,

    Jetzt möchte ich den Text im linken Div zentriert darstellen. Das klappt aber nur wenn ich dem div eine Breite gebe.

    Das glaube ich nicht. hast du es bei beiden DIVs schon einmal mit positiven  bzw. negativen Margins versucht, in der Breite des Platzbedarfs des zweiten, rechts floatenden Containers?

    Gruß Gernot

    1. Hallo,
      habs hinbekommen, auch dank dieser Hilfe:
      http://de.selfhtml.org/javascript/beispiele/fensterueberwachen.htm

      Unterhalb der Div-Container habe ich folgendes eingefügt:
      <script type="text/javascript">
         /* Überwachung von Internet Explorer initialisieren */
      window.onresize = neuAufbau;
         Weite = Fensterweite();
         document.getElementById('xNav1').style.width = (Weite-400)+'px';
      </script>

      Gruß Andreas

      1. Hallo Andreas,

        Hallo,
        habs hinbekommen, auch dank dieser Hilfe:
        http://de.selfhtml.org/javascript/beispiele/fensterueberwachen.htm

        es ist allerdings nicht empfehlenswert, etwas mit JavaScript, noch dazu über ein inperformantes ständiges Überwachen der Fensterbreite zu lösen, wenn man es, wie in deinem Fall, auch nur mit CSS machen kann.

        body, html { margin:0; padding:0; }  
        .leftCol {  padding:0 10px; margin-right:350px; float:left; text-align:center; }  
        .rightCol { width:330px; padding:0 10px; margin-left:-350px; float:right; }
        

        Gruß Gernot