float macht im IE probleme ...

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • float macht im IE probleme ...

    hi @all

    folgende situation ...

    es sollen drei container so angeordnet sein, dass eine art navigation rechts vom hauptcomtainer sichtbar ist.

    der container muss im html-fluss aber unbedingt nach dem container #wrapper eingebunden werden.

    im FF klappt alles wunderbar wie es soll.

    im IE hingegen klappt der container #navi soweit runter wie #wrapper hoch ist, wenn das browserfenster nicht mehr breit genug ist, um beide nebeneinander zu zeigen.

    ideen, anregungen, vorschläge?

    gruss
    haxe

    demo-code anbei ...

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>TestSeite</title>
    
    <style type="text/css">
    p {
        margin: 0;
        padding: 5px;
    }
    #wrapper {
        border: 1px solid #666;
        margin: 0;
        padding: 0 10px;
        float: left;
        width: 790px;
    }
    #navi {
        border: 1px solid #f0f;
        margin: 0;
        padding: 0;
        margin-left: 820px;
        width: 100px;
    }
    #footer {
        border: 1px solid #0f0;
        margin: 10px 0 0 0;
        padding: 0 10px;
        width: 790px;
    }
    </style>
    
    </head>
    
    <body>
    
    <div id="wrapper">
    
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
    
    </div>
    
    <div id="navi">
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
        <p>Lorem ...</p>
    </div>
    
    <br clear="all" />
    <div id="footer">
        <p>Lorem ...</p>
    </div>
    
    </body>
    </html>
    INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |



  • #2
    Wo sind deine 3 Container?
    ist wrapper der Hauptcontainer?
    also soll haupt-navi auf einer zeile und footer dadrunter stehen ja?
    bin etwas irritiert weil man "wrapper" normalerweise zum Umschließen der Container
    benutzt ;D

    setz mal navi auch auf float:left und klopp das margin raus
    Die Milch bleibt ranzig!

    Kommentar


    • #3
      und pack wrapper sowie navi noch mal in ein eigenes div. dann klappts auch im ie.

      gruß
      peter
      Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
      Meine Seite

      Kommentar


      • #4
        Wo sind deine 3 Container?
        sind doch alle zu sehen ... #wrapper, #navi und #footer. wobei #footer für das problem irrelevant ist ...

        ist wrapper der Hauptcontainer? [...] weil man "wrapper" normalerweise [...]
        ja #wrapper ist der hauptcontainer. und du hast recht. er wird weiteren content umschließen. nur diesen habe ich zur vereinfachung weg gelassen ;-)

        setz mal navi auch auf float:left und klopp das margin raus
        das ist ja nicht sinn der sache ... wenn das fenster schmaler wird, wird #navi ja direkt unterhalb von #wrapper gelegt.

        #navi muss immer rechts sein. auch wenn die fensterbreite nicht ausreicht, um es sichtbar darzustellen.
        INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


        Kommentar


        • #5
          Original geschrieben von Kropff
          und pack wrapper sowie navi noch mal in ein eigenes div. dann klappts auch im ie.
          dann muss ich dem #mainwrapper (so habe ich das div mal testweise genannt) eine feste breite mitgeben. dann klappts auch.

          das würde ich gerne vermeiden. auch die breitenangabe von #navi ist nur fiktiv. sinnvoll wäre hier eine dynamische anpassung nach rechts.

          lediglich #wrapper hat eine feste breite, bzw soll eine haben. der rest dynamisch.
          INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


          Kommentar


          • #6
            Was hast du denn generell für ein Layout?
            links gesetzt und nach rechts endlos auslaufend?
            ich glaube das wird mit nichtfixen Breiten sehr knifflig
            Die Milch bleibt ranzig!

            Kommentar


            • #7
              Original geschrieben von RanzigeMilch
              links gesetzt und nach rechts endlos auslaufend?
              genau ... die linke box #wrapper ist links am rand und hat eine fixe breite.

              rechts davon soll die box #navi mit flexibler breite sein.

              ist das fenster schmaler als breite aus #wrapper und aktueller (da dynamisch) breite von #navi soll #navi aber weiterhin und auf jeden fall rechts von #wrapper zu sehen sein.

              #navi darf auf keinen fall nach unten rücken oder unterhalb von #wrapper sein.
              INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


              Kommentar


              • #8
                und wenn dus einfach absolute positionierst?
                müsste doch gehen wenn der linke teil eine feste Breite hat
                Die Milch bleibt ranzig!

                Kommentar


                • #9
                  position: absolute oder auch relative will ich nicht haben.

                  das ganze konstrukt funktioniert im FF ja tadellos. nur was muss ich machen, dass es auch im IE klappt.
                  INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


                  Kommentar


                  • #10
                    sorry für offtopic aber

                    OffTopic:
                    float...div's....wrapper....Hat es vllt was mit TYPO3 zu tun? hört sich jedenfalls ziemlich danach an!


                    mfg

                    Kommentar


                    • #11
                      verstehe den zusammenhang nicht..
                      also abraxas mit fällt so spontan auch nix anderes ein (hab au net die zeit was zu testen ;D)
                      Die Milch bleibt ranzig!

                      Kommentar


                      • #12
                        Original geschrieben von infernalshade
                        Hat es vllt was mit TYPO3 zu tun?
                        100%ig nein. so'n dreck ...

                        Original geschrieben von RanzigeMilch
                        also abraxa[color=red]s[/color]
                        *hust*

                        aber danke dennoch für deine ideen ... evtl fällt ja noch jemanden was ein ... wo ist der wahsaga eigentlich? *g*
                        INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


                        Kommentar

                        Lädt...
                        X