kultursprung: div box float left

Hallo!

Ich habe folgendes Konstrukt:

------------------------------------------------
|------------||--------------------------------|
|            ||      div content               |
|            ||                                |
| Navigation |||------| |------|               |
|            ||| div A| | div1 |               |
|            |||      | |------|               |
|            |||      | |------|               |
|            |||      | | div2 |               |
|            |||      | |------|               |
|------------|||      | |------|               |
|             ||      | | div3 |               |
|             ||------| |------|               |
|             |                                |
|             ||---------------|               |
|             ||   div N       |               |
|             ||               |               |
|             ||---------------|               |
|             |                                |
|             ||---------------|               |
|             ||   div M       |               |
|             ||               |               |
|             ||---------------|               |
|             |--------------------------------|
------------------------------------------------

In Firefox und Opera wird das auch so angezeigt, und zwar stabil in Bezug auf den Zoomfaktor / Schriftgröße.

IE macht Probleme, sobald die Schriftgröße erhöht, oder das Fenster verkleinert wird: die divboxen 1-3 trotz Scrollbalken, nicht mehr neben "div A" anzeigt, sondern am unteren Rand, obwohl es so aussieht als sei neben "div A" noch genug Platz.

Sieht dann so aus:

------------------------------------------------
|------------||--------------------------------|
|            ||      div content               |
|            ||                                |
| Navigation |||------|                        |
|            ||| div A|                        |
|            |||      |                        |
|            |||      |                        |
|            |||      |                        |
|            |||      |                        |
|------------|||      |                        |
|             ||      |                        |
|             ||------|                        |
|             |                                |
|             |         |------|               |
|             |         | div1 |               |
|             |         |------|               |
|             |         |------|               |
|             |         | div2 |               |
|             |         |------|               |
|             |         |------|               |
|             |         | div3 |               |
|             |         |------|               |
|             |                                |
|             ||---------------|               |
|             ||   div N       |               |
|             ||               |               |
|             ||---------------|               |
|             |                                |
|             ||---------------|               |
|             ||   div M       |               |
|             ||               |               |
|             ||---------------|               |
|             |--------------------------------|
------------------------------------------------

Ich habe leider bisher keine Lösung gefunden.

Hier der Link zu der Seite: http://www.connexin.net/card-game-doppelkopf.html

  1. Niemand eine Idee?

  2. Hi,

    IE macht Probleme, sobald die Schriftgröße erhöht, oder das Fenster verkleinert wird: die divboxen 1-3 trotz Scrollbalken, nicht mehr neben "div A" anzeigt, sondern am unteren Rand, obwohl es so aussieht als sei neben "div A" noch genug Platz.

    das ist ein Bug, der vermutlich dadurch entsteht, daß der IE feststellt, der Platz reicht nicht aus, das Element daruner setzt, dann erneut feststellt, daß er immer noch icht reicht und Scrollbalken generiert.

    Du hast doch ein <div id="container"> - gebe diesem eine zum Inhalt passende Breite - wobei ich die Breiten ohnehin überdenken würde.

    Und übrigens: wozu setzt Du das CSS in CDATA und HTML-Kommentar?

    freundliche Grüße
    Ingo

    1. das ist ein Bug, der vermutlich dadurch entsteht, daß der IE feststellt, der Platz reicht nicht aus, das Element daruner setzt, dann erneut feststellt, daß er immer noch icht reicht und Scrollbalken generiert.

      Danke für den Hinweis!

      Du hast doch ein <div id="container"> - gebe diesem eine zum Inhalt passende Breite - wobei ich die Breiten ohnehin überdenken würde.

      Was genau soll ich da überdenken: die Breiten an sich, oder die Werte?

      Und übrigens: wozu setzt Du das CSS in CDATA und HTML-Kommentar?

      Hab ich mir aus Gründen, die mir gerade nicht mehr bewußt sind, mal so angewöhnt (historisch gewachsen). Du meinst, das sei unnötig?

      1. Hallo kultursprung.

        Und übrigens: wozu setzt Du das CSS in CDATA und HTML-Kommentar?

        Hab ich mir aus Gründen, die mir gerade nicht mehr bewußt sind, mal so angewöhnt (historisch gewachsen). Du meinst, das sei unnötig?

        Die HTML-Kommentierung ist nur für sehr alte Clients erforderlich, die andernfalls den Inhalt des style-Elementes als Text anzeigen würden.

        Das einfassen in einen CDATA-Bereich ist im Grunde nur bei XML und als XML ausgeliefertem XHTML erforderlich.
        (Wobei dies hauptsächlich bei JS nötig ist; in CSS gibt es momentan noch keinen Einsatzort für das krtische „<“-Zeichen.)

        Einen schönen Sonntag noch.

        Gruß, Ashura

        --
        sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
        <mathbr:del.icio.us />
      2. Hi,

        Was genau soll ich da überdenken: die Breiten an sich, oder die Werte?

        Die Breiten sind so gewählt, daß ich die Schriftgröße stark verkleinern muß, um im 1024px breitem Fenster nicht querscrollen zu müssen.

        freundliche Grüße
        Ingo

    2. Der div Box "container" eine Breite in em mitzugeben erledigt das Problem.

      Die Kommentare im css-Bereich habe ich entfernt.