hawkmaster: Unterschiedliche Breiten Darstellung / Positionen IE und FF

Hallo zusammen,

Mir ist nicht ganz klar warum der IE (IE7) und der Firefox 3.5 Breitenangaben so unterschiedlich interpretieren?

Beispiel 1:

Ein Div auf einer Loginseite:
<div id="loginarea">
Per CSS Style möchte ich dies etwas nach links verschieben.
Wenn ich nur "padding-left:20em" angebe fängt der IE fast 1,5 cm weiter links an. Ich muss also zu einem kleinen "Trick" greifen damit das ungefähr für beide stimmt.
#loginarea{
padding-left:21em;
*padding-left:17em;

Beispiel 2:
#loginarea input{
/*width:15em;*/
width:180px;
}

Wenn ich die Breite mit "180px" angebe ist das Textfeld beim FF ca. 4,5cm breit, beim IE 4cm. Mit der Angabe von "15em" wird es noch gravierender. Hier hat der FF 4,7cm und der IE sogar 5,5cm.

Wie löst ihr Experten denn sowas?
Sollte man möglichst mit Conditional Comments für jeden Browsertyp unterschiedliche CSS Dateien einbinden?

vielen Dank und viele Grüße
hawk

  1. Hi,

    Wenn ich nur "padding-left:20em" angebe fängt der IE fast 1,5 cm weiter links an.

    Weil ggf. eine andere (Default-)Schriftgröße als Basis für em dient.

    Ich muss also zu einem kleinen "Trick" greifen damit das ungefähr für beide stimmt.

    Wenn Du absolute Pixel-Positionen haben willst, dann arbeite nicht mit em.

    Wenn ich die Breite mit "180px" angebe ist das Textfeld beim FF ca. 4,5cm breit, beim IE 4cm.

    Ist der IE im Quirksmodus und damit im Ichkümmeremicheinenscheissdreckumdiecssrecommendationundberechnebreitenwieichwill-Modus?

    Mit der Angabe von "15em" wird es noch gravierender. Hier hat der FF 4,7cm und der IE sogar 5,5cm.

    s.o., andere Fontsize als Basis? Dazu noch der Ichkümmeremicheinenscheissdreckumdiecssrecommendationundberechnebreitenwieichwill-Modus?

    Sollte man möglichst mit Conditional Comments für jeden Browsertyp unterschiedliche CSS Dateien einbinden?

    Nö.

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    O o ostern ...
    Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
    1. Hallo Andreas,
      vielen Dank für deine Erklärungen.

      Wenn Du absolute Pixel-Positionen haben willst, dann arbeite nicht mit em.

      OK das werde ich dann in Zukunft machen. Ich meinte nur gelesen zu haben, dass man besser alle Angaben in em machen soll, wegen Skalierbarkeit?

      Ist der IE im Quirksmodus und damit im Ichkümmeremicheinenscheissdreckumdiecssrecommendationundberechnebreitenwieichwill-Modus?

      Ich verwende überall diesen DOCTYPE:

      <!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" lang="en" xml:lang="en">

      Das müsste doch ok sein und nicht den Quirksmodus auslösen oder?

      vielen Dank und viele Grüße
      hawk

      1. Hi,

        Wenn Du absolute Pixel-Positionen haben willst, dann arbeite nicht mit em.
        OK das werde ich dann in Zukunft machen. Ich meinte nur gelesen zu haben, dass man besser alle Angaben in em machen soll, wegen Skalierbarkeit?

        Ja - aber dann darfst Du nicht exakte cm-Positionen erwarten.

        <!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" lang="en" xml:lang="en">

        Das müsste doch ok sein und nicht den Quirksmodus auslösen oder?

        Sollte eigentlich nicht.

        cu,
        Andreas

        --
        Warum nennt sich Andreas hier MudGuard?
        O o ostern ...
        Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
      2. Hi,

        Ich meinte nur gelesen zu haben, dass man besser alle Angaben in em machen soll, wegen Skalierbarkeit?

        richtig. Der *Zweck* dieses Vorgehens ist es, unterschiedliche Größen abhängig vom System zu ermöglichen.

        Wie hast Du übrigens die Zentimeterwerte ermittelt? Hast Du den Bildschirminhalt per Beamer an die Wand des Nachbarhauses geworfen und mit einem Lineal gemessen, das sich einen Meter von Deinem Kopf entfernt befindet?

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:| br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. Hi,

          Wie hast Du übrigens die Zentimeterwerte ermittelt?

          Nun ich habe einfach an meinem Monitor mit dem Lineal gemessen?
          Ist was falsch daran?

          vielen Dank und viele Grüße
          hawk

          1. Hallo,

            Wie hast Du übrigens die Zentimeterwerte ermittelt?
            Nun ich habe einfach an meinem Monitor mit dem Lineal gemessen?

            ist das eine Frage.

            Ist was falsch daran?

            Nicht direkt falsch - aber es ist ebenso aussagekräftig, als würdest du die Tageszeitung nehmen und alle 'y' auf der Titelseite zählen.
            Monitore sind verschieden groß und haben sehr unterschiedliche Auflösungen. Deine 1.5cm (die besser 15mm wären, cm ist IMO eine unhandliche Einheit) könnten bei einem Monitor 25px sein, bei einem anderen 125px. Du siehst die Relevanz deiner Zentimeter-Angabe?

            So long,
             Martin

            --
            Wenn du beim Kochen etwas heißes Wasser übrig hast, friere es ein.
            Heißes Wasser kann man immer gebrauchen.
            Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
            1. Hallo,

              Nicht direkt falsch - aber es ist ebenso aussagekräftig, als würdest du die Tageszeitung nehmen und alle 'y' auf der Titelseite zählen.
              Monitore sind verschieden groß und haben sehr unterschiedliche Auflösungen. Deine 1.5cm (die besser 15mm wären, cm ist IMO eine unhandliche Einheit) könnten bei einem Monitor 25px sein, bei einem anderen 125px. Du siehst die Relevanz deiner Zentimeter-Angabe?

              nun, man muss ja auch nicht alles auf die Goldwaage legen oder?
              Es ging mir doch primär darum, dass der IE7 die Breitenangaben anders darstellt als der FF. Wenn ich nun an meinem Monitor mit der gleichen Auflösung einmal die Breite des Textfelds messe mit dem IE7 und einmal mit FF, dann ist das doch eine Aussage.
              Natürlich leuchtet es mir ein das ich hier keine allgemein gültige Breitenangabe machen kann und das bei einem anderen Monitor mit anderer Auflösung andere Werte herauskommen.

              By the way: Ich habe nun den IE8 aufgerufen. Das sind fast Welten zum IE7. Hier stimmt fast alles mit dem FF überein.

              vielen Dank und viele Grüße
              hawk

              1. Hi there,

                By the way: Ich habe nun den IE8 aufgerufen. Das sind fast Welten zum IE7. Hier stimmt fast alles mit dem FF überein.

                Welches Deiner Probleme betrachtest Du als gelöst, nur weil Du einen anderen Browser verwendest?

                1. Hallo,

                  Welches Deiner Probleme betrachtest Du als gelöst, nur weil Du einen anderen Browser verwendest?

                  Nun, offensichtlich kann der IE8 im Gegenzug zu IE7 mit CSS wesentlich besser umgehen.
                  So zeigt er z.b. wunderbar die Stylesheet Angaben;
                  label[accesskey]:after {
                  content: " [" attr(accesskey) "]";
                  ..

                  Das konnte der 7er nicht. Und auch das Layout sieht wesentlich besser aus.

                  vielen Dank und viele Grüße
                  hawk

                  1. Hi there,

                    Welches Deiner Probleme betrachtest Du als gelöst, nur weil Du einen anderen Browser verwendest?

                    Nun, offensichtlich kann der IE8 im Gegenzug zu IE7 mit CSS wesentlich besser umgehen.

                    Naja, was ich meinte, Du machst eine Webseite ja nicht nur für Dich sondern auch für Anwender, die unter Umständen auch den IE7 verwenden...

                    1. Hallo

                      Naja, was ich meinte, Du machst eine Webseite ja nicht nur für Dich sondern auch für Anwender, die unter Umständen auch den IE7 verwenden...

                      Ja, schon klar, das ich nie weiss welcher Browser eingesetzt wird.
                      Es handelt sich jedoch um eine reine Intranet Anwendung und man könnte zumindest Browser Empfehlungen geben.
                      Natürlich kann man die Seite auch im IE7 oder IE6 bedienen.

                      vielen Dank und viele Grüße
                      hawk