iehasser: ie zeigt lücken, während alle anderen es richtig anzeigen

hi.
also ich hab mal nen code gemacht,
im firefox funzt er tadellos, auch netscape, opera... alle zeigen es korrekt an,
nur der ie nicht.

da ja noch immer so viele unverständlicherweise den benutzen, will ich auch für die leute die anzeige korrekt darstellen lassen.

der code-ausschnitt, um den geht geht:

<div style="width:1024px; background-color:#ffffff">
<div style="float:left; width=266;"><img src="bildlinks.jpg" border="0" width="266" height="222"></div>
<div style="float:right; width=268;"><img src="bildrechts.jpg" border="0" width="268" height="222"></div>
<img src="bildmitte.jpg" border="0" width="490" height="107">
inhalt der unter dem mittleren bild, zwischen dem rechten und linken steht

alle drei bilder füllen von der breite her eigentlich die 1024pixel aus.
der ie zeigt das mittlere bild aber nicht zwischen dem rechten und linken, sondern darunter.
wenn ich das mittlere bild um 6pixel kleiner mache, zeigt ers auch zwischen dem rechten und linken bild an,
aber mit jeweils nem breiten streifen zum rechten und linken bild.

ich könnte zwar alles mit ner table machen, aber ich benutz ungern tables.
ich versteh nicht, wieso der ie da lücken anzeigt.
muss ja irgendwas mit den div-containern zu tun haben

  1. Hello out there!

    <div style="width:1024px; background-color:#ffffff">
    im firefox funzt er tadellos, auch netscape, opera... alle zeigen es korrekt an,

    Davon kann keine Rede sein. Was ist, wenn der Viewport des Nutzers schmaler ist als 1024 Pixel? Horizontales Scrollen ist nutzerfeindlich.

    alle drei bilder füllen von der breite her eigentlich die 1024pixel aus.
    der ie zeigt das mittlere bild aber nicht zwischen dem rechten und linken, sondern darunter.

    Vor dem 'img'-Knoten ist noch ein Textknoten mit einem Whitespace Kind des umschließenden 'div'.

    See ya up the road,
    Gunnar

    --
    „Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)
  2. Hi!

    der code-ausschnitt, um den geht geht:

    <div style="width:1024px; background-color:#ffffff">
    <div style="float:left; width=266;"><img src="bildlinks.jpg" border="0" width="266" height="222"></div>
    <div style="float:right; width=268;"><img src="bildrechts.jpg" border="0" width="268" height="222"></div>
    <img src="bildmitte.jpg" border="0" width="490" height="107">

    • Google mal, warum man keine Inline-Styles verwenden sollte.
    • Bei den beiden DIVs, die die Images umschließen, fehlen die Einheiten bei den width-Angaben. Die DIVs sind im übrigen auch nicht notwendig.

    inhalt der unter dem mittleren bild, zwischen dem rechten und linken steht

    Wieso sollte der Text "zwischen dem rechten und linken" stehen?

    alle drei bilder füllen von der breite her eigentlich die 1024pixel aus.

    Selbst wenn der Viewport des Users 1024px breit ist, ist dein (beabsichtigtes) Layout spätestens dann hinüber, sobald es eine vertikale Scrollleiste gibt.

    der ie zeigt das mittlere bild aber nicht zwischen dem rechten und linken, sondern darunter.

    Vermutlich der "3px Bug" des IE <= 6 - siehe u.a. hier

    Gruß Gunther

    1. Hi,

      <div style="float:left; width=266;"><img src="bildlinks.jpg" border="0" width="266" height="222"></div>
      <div style="float:right; width=268;"><img src="bildrechts.jpg" border="0" width="268" height="222"></div>

      • Bei den beiden DIVs, die die Images umschließen, fehlen die Einheiten bei den width-Angaben.

      Da gibt's keine width-Angaben, nur width=266 bzw. width=268 - bei beiden fehlt der Doppelpunkt und der Wert - wobei die Eigenschaften natürlich gar nicht existieren.

      cu,
      Andreas

      --
      Warum nennt sich Andreas hier MudGuard?
      Schreinerei Waechter
      O o ostern ...
      Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    2. hi Gunther.

      jo danke, dass mit dem 3px-bug hat mir sehr weitergeholfen.

      @ll:
      inline-styles hab ich bei ner seitenprogrammierung anfangs immer, weil ich es viel übersichtlicher so find.
      ich lager es erst später in ne css aus.

      das mit den 1024px werd ich vllt noch ändern. denk mal so viele werden aber nicht mehr so ne niedrige auflösung habn..

      das is die erste seite,die ich auch ie-freundlich stylen will.

      bei meinen hunderten davor hab ich immer extra anti-ie-hacks eingebaut, dass der nur müll anzeigt ^^

      aber auch euch ein danke.

      1. Hallo,

        inline-styles hab ich bei ner seitenprogrammierung anfangs immer, weil ich es viel übersichtlicher so find.
        ich lager es erst später in ne css aus.

        ich bin nicht der Meinung - ich finde es übersichtlicher, wenn ich meine Stylesheets von Anfang an separat habe. Aber jeder nach seinem Geschmack ...

        das mit den 1024px werd ich vllt noch ändern. denk mal so viele werden aber nicht mehr so ne niedrige auflösung habn..

        Es geht nicht um die Auflösung, sondern um die Fenstergröße! Und die dürfte bei einem großen Teil der User <1024px in der Breite sein. Viele haben ihr Browserfenster nicht maximiert, erst recht nicht bei großen Bildschirmen, und zusätzliche Symbolleisten und/oder Sidebars brauchen auch ihren Platz.

        bei meinen hunderten davor hab ich immer extra anti-ie-hacks eingebaut, dass der nur müll anzeigt ^^

        Wie gemein. ;-)
        Und IMHO dumm. Auch wenn der Anteil des IE zurückgeht, ist er vermutlich immer noch der meistbenutzte Browser - zumindest in der Windows-Welt. Ihm nicht extra mit Krücken nachzuhelfen, finde ich noch okay; ihn aber bewusst auszuschließen, ist kurzsichtig.

        So long,
         Martin

        --
        Funktion und Referenz auf diese sind mir bekannt, mit Zeigern kann ich nicht viel mehr anfangen, als damit auf Buttons zu klicken.
          (Ashura)