Mäuse melken mit Explorer die 2te: Heute mit <legend>

[tox]

Hallo,

ich habe mir eine kleines, valides Formular mit HTML und CSS gestrickt. Die Darstellung im FF, OP, NS ist tadellos, aber Ihr glaubt es nicht: Im IE 5.01, 5.5 und 6 kommt es zu Abweichungen. Diese Verschieben die Legend um 7 Pixel nach recht. Warum? Und was kann man dagegen machen?

Was bei mir die grossen Fragezeichen auslöst ist, dass padding und margin für die Legend bereits auf 0 gesetzt sind und trotzdem wird das Ding eingerückt. Sitzt ich oder Microsoft auf dem Schlauch?

Hier der Code:

          <h1>Administrator Login</h1>  
          <p>Please enter your username and your password for login. </p>  
          <form method="get" action="index.htm">  
            <fieldset>  
              <legend>Login informations&nbsp;</legend>  
              <ul class="form">  
                <li class="form_x"><label for="username">Username</label><input type="text" maxlength="40" name="username" id="username" class="form" /></li>  
                <li class="form_x"><label for="password">Password</label><input type="text" maxlength="40" name="password" id="password" class="form" /></li>  
                <li class="form_end"><input type="reset" value="Reset" class="reset" /><input type="submit" value="Submit" class="submit" /></li>  
              </ul>  
            </fieldset>  
          </form>

Hier das dazugehörige CSS:

fieldset {  
   width: 600px;  
   background: url(/img/formback2.gif) left bottom repeat-x;  
   padding: 0;  
   border: none;  
   border-top: 1px solid #ccc;  
   margin: 0;  
}  
legend {  
   color: #333;  
   font-size: 1.2em;  
   padding: 0;  
   border: none;  
   margin: 0;  
}  
ul.form {  
   list-style: none;  
   padding: 0;  
   border: none;  
   margin: 0;  
}  
li.form_x {  
   width: 600px;  
   background: url(/img/formdiv.gif) left bottom repeat-x;  
   padding: 12px 0 12px 0;  
   border: none;  
   margin: 0;  
}  
li.form_end {  
   width: 600px;  
   padding: 12px 0 12px 0;  
   border: none;  
   margin: 0;  
}  
label {  
   font-size: 1.1em;  
   width: 175px;  
   display: block;  
   clear: both;  
   float: left;  
   padding: 0 0 0 25px;  
   border: none;  
   margin: 0;  
}  
input.form {  
   width: 370px;  
   font-family:  'times new roman', times, serif;  
   font-size: 1em;  
   padding: 0;  
   margin: 0;  
}  
input.reset {  
   width: 175px;  
   font-family:  'times new roman', times, serif;  
   font-size: 1em;  
   padding: 0;  
   margin: 0 0 0 200px;  
}  
input.submit {  
   width: 175px;  
   font-family:  'times new roman', times, serif;  
   font-size: 1em;  
   padding: 0;  
   margin: 0 0 0 25px;  
}

Meine armen Mäuse flehen schon wieder um Gnade.

Gruss und Danke

[Cheatah]

Hi,

Im IE 5.01, 5.5 und 6 kommt es zu Abweichungen. Diese Verschieben die Legend um 7 Pixel nach recht. Warum?

weil IE bei <legend>-Elementen einen horizontalen Abstand einfügt. Das war ja leicht ;-)

Und was kann man dagegen machen?

Der Abstand ist auch bei margin:0px und padding:0px noch vorhanden. Eine dieser beiden Eigenschaften erlaubt aber negative Werte.

Sitzt ich oder Microsoft auf dem Schlauch?

Wundere Dich nie darüber, dass der IE sich anders verhält, als es der Standard oder der gesunde Menschenverstand diktiert.

<ul class="form">
                <li class="form_x">[...]

Über ein paar Deiner Klassen solltest Du ggf. noch mal meditieren.

Cheatah

[tox]

weil IE bei <legend>-Elementen einen horizontalen Abstand einfügt. Das war ja leicht ;-)

Bitte schick mir doch ein Gehirn Image von dir, damit ich das in meine Rübe mergen kann, dann muss ich nicht immer so dusselig übers Forum fragen :-)

Aber ehrlich: Ich finde das echt stark, dass Du die ganzen Eigenheiten vom IE kennst. Hast Du da eine Liste? Wenn ja, dann her damit.

Der Abstand ist auch bei margin:0px und padding:0px noch vorhanden. Eine dieser beiden Eigenschaften erlaubt aber negative Werte.

"Komischerweise" geht es mit margin-left: -7px; FF, OP und NS halten die Füsse still und stellen sauber dar. Das ist offensichtlich so gewollt? Weisst Du was dahinter steckt?

Wundere Dich nie darüber, dass der IE sich anders verhält, als es der Standard oder der gesunde Menschenverstand diktiert.

Ich muss halt immer aus Frust meine Mäuse melken. Und Du kannst Dir vorstellen, dass die Duttis von den armen Kleinen ständig geschwollen sind, obwohl sie ja gar nichts dafür können. Aber dieser Gates hat einfach zu viele Bodyguards, sonst würden meine Mäuse sich schon lange an ihm rächen. LOL

<ul class="form">
                <li class="form_x">[...]

Über ein paar Deiner Klassen solltest Du ggf. noch mal meditieren.

Du meinst weil ein Tagname darin vorkommt? Ehrlich gesagt habe ich noch ein Problem damit gehabt. Was könnte denn schief gehen.

BTW: Riesen Dankeschön

und Gruss

[Der Martin]

Hallo,

Aber ehrlich: Ich finde das echt stark, dass Du die ganzen Eigenheiten vom IE kennst. Hast Du da eine Liste? Wenn ja, dann her damit.

die Liste hat er wahrscheinlich auch nur in seinem organischen Speicher ...

<ul class="form">
                <li class="form_x">[...]

Über ein paar Deiner Klassen solltest Du ggf. noch mal meditieren.
Du meinst weil ein Tagname darin vorkommt?

Nein, weil du zu viele überflüssige hast. Klassen, meine ich. Viele sind überflüssig, weil man die Elemente ebensogut über den Nachfahrenselektor ansprechen kann.

So long,
 Martin

[tox]

"Komischerweise" geht es mit margin-left: -7px; FF, OP und NS halten die Füsse still und stellen sauber dar.

Schei... nein. Da war ich zu hastig. Sämtliche Operas verweigern die Sauberkeit! Jetzt ist die Legend im OP zu weit links. Gibt es eine Opera Weiche für negative Margins?

Verflu..t, her mit den Mäusen! :-)

[OhneName]

Hallo tox,

du brauchst doch gar keine Weiche für den Opera. Er macht doch nur genau das, was du ihm sagst: margin-left:-7px. Das Problem bestand doch nur im IE, also sorge dafür, dass nur der IE sich um deinen Workaround kümmert. Und IE-Weichen gibts ja mehr als Sicherheitslücken in Windows, also sollte es ja nicht so schwer sein eine zu finden.

gruss,
OhneName

[tox]

Hi OhneName,

du brauchst doch gar keine Weiche für den Opera.

Da hast Du natürlich recht.

also sorge dafür, dass nur der IE sich um deinen Workaround kümmert.

Hab ich gemacht, hatte sowieso schonen einen "* html" drin, jetzt steht halt einer mehr drin. Danke für den Hinweis, der war goldrichtig.

Und IE-Weichen gibts ja mehr als Sicherheitslücken in Windows

Das bezweifel ich allerdings ;-)

Gruss

[Cheatah]

Hi,

Bitte schick mir doch ein Gehirn Image von dir,

das steht Dir bereits zur Verfügung, Du hast schließlich einen Internet-Anschluss. Und morgen lasse ich alle Telefone der Welt gleichzeitig klingeln. Äh ... :-)

Aber ehrlich: Ich finde das echt stark, dass Du die ganzen Eigenheiten vom IE kennst. Hast Du da eine Liste?

Bedaure, ich kann leider nur mit Erfahrung dienen. Nun ja, http://www.positioniseverything.net/explorer.html ist natürlich erwähnenswert. Aber im Wesentlichen löse ich die Probleme entweder selbst, weil ich sie schon kenne, oder durch eine gezielte Recherche im Netz.

Ich muss halt immer aus Frust meine Mäuse melken.

Das geht schon in Ordnung. Die Fachwelt nennt das "Zinsen".

Aber dieser Gates hat einfach zu viele Bodyguards, sonst würden meine Mäuse sich schon lange an ihm rächen. LOL

Vor allem hat Herr Gates selbst zu viele Mäuse :-)

Über ein paar Deiner Klassen solltest Du ggf. noch mal meditieren.
Du meinst weil ein Tagname darin vorkommt?

Nein, weil der Inhalt sie augenscheinlich nicht rechtfertigt.

Cheatah

[Der Martin]

Moin,

Im IE 5.01, 5.5 und 6 kommt es zu Abweichungen. Diese Verschieben die Legend um 7 Pixel nach recht. Warum? Und was kann man dagegen machen?

es einfach hinnehmen? Was sind schon 7px? Ein pixelgenaues Layout ist sowieso oft nicht realisierbar, bzw. nur unter genau bekannten und kontrollierbaren Rahmenbedingungen, die du im Web eben nicht hast.

<legend>Login informations&nbsp;</legend>

Übrigens ist dir bei "Login information" versehentlich noch ein 's' reingerutscht.

Meine armen Mäuse flehen schon wieder um Gnade.

Verstehe. Hast du eigentlich einen so kleinen Eimer? ;-)

Schönes Wochenende,
 Martin

[tox]

Tach,

es einfach hinnehmen? Was sind schon 7px? Ein pixelgenaues Layout ist sowieso oft nicht realisierbar, bzw. nur unter genau bekannten und kontrollierbaren Rahmenbedingungen, die du im Web eben nicht hast.

Ich weis, ich weis. Aber am Zeilenanfang ein Einzug, so gross wie ein Buchstabe, das geht nicht!

Übrigens ist dir bei "Login information" versehentlich noch ein 's' reingerutscht.

Mercn.

Verstehe. Hast du eigentlich einen so kleinen Eimer? ;-)

Eimer? Du hälst Deine Mäuse in einem Eimer? Ich ruf sofort den Tierschutz! *bg* Nein, meine Mäuse sind schon wieder ganz entspannt seit Cheatahs Antwort.

Gruss

[Der Martin]

Hi,

Verstehe. Hast du eigentlich einen so kleinen Eimer? ;-)
Eimer? Du hälst Deine Mäuse in einem Eimer?

nee, aber wie willst du sie denn melken, wenn du keinen Eimer drunterstellen kannst? Das ist es doch gerade, was das Mäusemelken so schwierig macht, oder nicht?
Keine Bange, meine Mäuse genießen Freiheit. Naja, jedenfalls, soweit das Kabel reicht. *g*

Nein, meine Mäuse sind schon wieder ganz entspannt seit Cheatahs Antwort.

Na, dann isses ja gut. *puh*

Ciao,
 Martin

[MudGuard]

Hi,

nee, aber wie willst du sie denn melken, wenn du keinen Eimer drunterstellen kannst? Das ist es doch gerade, was das Mäusemelken so schwierig macht, oder nicht?

Ich sage nur: Fingerhut.

cu,
Andreas