Zur Navigation

Neue Seite: Was sagt der IE?

1 Domenika

So, nun ist die erste Version online.
css + html sind validiert.
Da ich hier aber nur einen neuen Mac zur Verfügung habe (auf dem es ganz toll natürlich ganz toll aussieht), freue ich mich über einen Browser-Check vom PC / Explorer (was ja wohl der Großteil der Internetnutzer benutzt).
Und sonstiges, falls jemanden etwas einfällt :)

Danke!

http://www.traumhelfer.de

Domenika

01.05.2006 01:32

2 C)-(iLL@

Sicher, dass Du Dich darüber freust? ^^

Na gut :)

Ein Trost: in Firefox siehts (natürlich) sehr gut aus.

01.05.2006 01:42 | geändert: 01.05.2006 01:44

3 Domenika

Ja, seufz, das hab ich schon befürchtet. Weiß Du auch, wie ich das beheben kann?

01.05.2006 01:44

4 Jörg

Auch Opera hat mit der Seite keine Probleme - ebenso der IE 7 - die Seite ist mal ein Beispiel, dass der neue IE doch ein klein wenig dazu gelernt hat :)

Zum IE 6:

1. er kann mit dem position:fixed nicths anfangen, und zeigt die betreffenden Elemente als position:static an - d.h. die Positionierungsangaben sind für die Katz. Besser wäre deswegen ein position:absolute. Den modernen Browsern und dem IE 7 schiebt man das position:fixed nachträglich mit einem Hack unter:

div#header {
    position:absolute;
    top:0px;
    left:0px;
    right:0px;
    width:800px;
    height:141px;
    background: white;
    color: black;
    background-image:url(grafiken/top.jpg);
    background-repeat:no-repeat;
    padding:10px;
	}

html>body div#header {
 position:fixed; 
}

.buttonscontainer {
	position:absolute;
    top: 9.8em;
    left: 1em;
	width: 125px;
	background-color: #FFFFFF;
	font-family: Verdana,Helvetica,Arial,sans-serif;
	font-weight: normal;
	display: block;
	text-align: left;
	padding: 2px;
	}

html>body .buttonscontainer { 
position:fixed;
}

2. Der IE 6 ignoriert die margin-top Angabe für div#Inhalt. Man kann diese aber durch eine padding-top Angabe ersetzen:

div#Inhalt {
    padding: 9em 1em 0;
    margin: 0 0 0 190px;
    text-align: top;
 	 }

01.05.2006 08:36 | geändert: 01.05.2006 08:37

5 Domenika

Guten Morgen,

daß der IE lernfähig ist, ist ebenso erstaunlich, wie erfreulich :)

Der 2. Punkt ist mir heute Nacht im Bett auch gekommen, aber ich hätte ewig rumprobieren müssen, also: vielen Dank!

Zu Punkt 1.: ich erinnere mich dunkel sowas gelesen zu haben, aber das mit dem Hack leuchtet mir nicht ganz ein (woher weiß der Explorer, daß er das nehmen soll und die anderen nicht?)... but nevermind, muß ja nicht alles verstehen, hauptsache es funktioniert.

Ich hatte da damals ja eine css-Vorlage von SelfHTML kopiert und für meine Bedürfnisse modifiziert. Da steht auch:

/* Und für den Internet Explorer */
* html #header {
    margin:0;
    height:10%;
	}
drin. Sollte das drin bleiben?

Ich hab die Veränderungen jetzt online gestellt. Falls nochmal jemand gucken könnte wäre ich dankbar :)

http://www.traumhelfer.de

Domenika

01.05.2006 11:39

6 C)-(iLL@

woher weiß der Explorer, daß er das nehmen soll und die anderen nicht?

Den IEx6 weiß nicht, dass das CSS ist ^^ Er kennt kein '>', wie so vieles nicht, was CSS 2 ist. So was wie html > body oder div > p übergeht er einfach, auch element[attribut], z.B. div[class] ist ihm fremd.

Richtige Browser kennen * html nicht, was auch im Grunde wenig Sinn machen würde. Deshalb zählt 'Star-Html' auch zu den CSS-Hacks, die oben genannten sind keine wirklichen Hacks, weil sie im Grunde konformes CSS2 sind, und nur wegen des mangelnden CSS-Selektoren-Supports des IE funktionieren. Teilweise befindet der sich damit auf einer Stufe mit dem Dinosaurier Netscape 4, muss aber aufgrund seiner unverschämten Verbreitung immer fleißig unterstützt werden, außer man will sich nicht ärgern.


Ich hab die Veränderungen jetzt online gestellt. Falls nochmal jemand gucken könnte wäre ich dankbar :)

Wenn die Seite horizontal gstreckt wird, dann bewegt sich der Seiteninhalt vom Menü weg. Das kannst Du noch so korrigieren:

* html div#Inhalt {
    height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */
    margin-bottom: 0;
    position:absolute;
    left:0;
  	}

Wenn ich den von Dir angesprochenen * html #header - Block rausnehme, kann ich beim IE keinen Unterschied erkennen. Merkst Du auf dem IE Mac was?

01.05.2006 13:47 | geändert: 01.05.2006 13:48

7 Domenika

Danke für die informative Antwort nochmals! Habs jetzt so aktualisiert, sollte laufen.

Für Mac OSX gibts keinen Explorer mehr. Die Randgruppe der MacUser wird von Micorsoft nicht mehr bedient ;)

Daher bin ich hier völlig aufgeschmissen und danke für eure IE-Feedbacks :)

Grüße
Domenika

01.05.2006 15:37

8 Jörg

Für Mac OSX gibts keinen Explorer mehr. Die Randgruppe der MacUser wird von Micorsoft nicht mehr bedient ;)

Microsoft hat die Entwicklung des Mac-IE eingestellt, da sie eingesehen haben, dass sie mit einem rückständigen Browser keine Chance mehr haben, wenn dieser nicht mehr vorinstalliert ist :)

danke für eure IE-Feedbacks :)

Kannst dich beizeiten ja mit einem Safari-Feedback revanchieren :) (Falls du hier im Forum z.B. auf Unverträglichkeiten stoßen solltest - bitte bescheid geben!)

01.05.2006 17:03

9 Domenika

Klar, wird gemacht :)

01.05.2006 18:56

10 Domenika

Heute hatte ich die Gelegenheit mir auf einem IE die Seite anzusehen.
Leider mußte ich feststellen, daß:

1. die Breite des Textfeldes, die ich bei div#Seite mit width angegeben habe ignoriert wird und der Text jetzt je nach Browserfenstergröße in die Breite geht. Hier die (wahrscheinlich) relevanten parts des css:
(die /* Kommentare stammen von der Vorlage von SelfHTML)


div#Seite {
    text-align: left;    /* Seiteninhalt wieder links ausrichten */
    margin: 0 auto;      /* standardkonforme horizontale Zentrierung */
    width: 760px;    
    padding: 0;
    color: black;
    background: white;
    border: 0;
    }
      
html>body div#Seite {
    border-color: gray;  /* Farbangleichung an den Internet Explorer  */
    }


div#Inhalt {
    padding: 9em 1em 0;
    margin: 0 0 0 190px;
    text-align: top;
    }

* html div#Inhalt {
   height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */
   margin-bottom: 0;
   position:absolute;
   left:0;
  }

2. die Fußzeile gar nicht angegeben wird

 p#Fusszeile {
    clear: both;
    color: #999999;
    font-size: 0.65em;
    margin: 0; 
    padding: 1em;
    text-align: center;
    background-color: #FFFFFF;
    width:800px;
    border-top: 1px solid silver;
    }

Ich hoffe, daß mir jemande helfen kann, dem IE das beizubringen! DAnke!

Domenika

02.05.2006 13:36