Templaterie Blog

Es ist noch nicht alle Hoffnung für die Redmonder verloren. Nachdem die Redmonder angekündigt hatten, dass sie ohne Targeting-Metatag mit ihrem IE8 den Kopf in den IE7-Sand stecken wollten, gab es mit Recht einiges Rumoren unter den Webdesignern (auch hier). Wer seinen Job ernst nimmt, der bemüht sich mit den Seiten aktuell zu bleiben und gemäß den Standards eine Webseite in bestmöglicher Weise zu schreiben. Wer seinen Job ernst nimmt versucht hier und da die neuen Feature einzelner Browser einzubauen, wenn diese dem Design und der Funktion dienen.

Es ist nicht der gemeinsame kleinste Nenner der Webdesign vorantreibt. Es wird der gemeinsame kleinste Nenner bedient. Das ist ein gewaltiger Unterschied, den die Redmonder so langsam doch begreifen wollen.

Langer Rede kurzes Zitat:

We’ve decided that IE8 will, by default, interpret web content in the most standards compliant way it can. This decision is a change from what we’ve posted previously.

Quelle: MSDN.com IE-blog: Microsofts interoperability principles and IE8 via einfach für alle

Good decision!

Filed under: HTMl&CSS, Webdesigner sein, Webtechniken
2 Comments

Der Fuß im Bigfoot des Gespaa-Wordpress-Template hat ein kleines Problem, wenn bei Kommentaren viele sehr lange Titel vorkommen, denn dann werden diese in den roten Fuß hineingeschoben, oder auch wer wie ich etwas zu heftig in der Kategorienvergabe wird … die zwei neuen Kategorien, waren dann einfach zu viel, nun war nicht mehr nur das input-Feld etwas schepps im Rot, sondern das ganze *****deite Formular und die Begriffe nur noch schwer lesbar. Langer Rede kurzer Flicken, die absolute Höhe einfach aufbrechen mit min-height achten Sie auf die Anderungen in Zeile 4:

1. #ancillary{
2. padding:20px 0 0 0;
3. background: #415262;
4. height: 440px;
5. color:#8798A8;
6. border-top:6px solid #7C8999;
7. border-left:1px solid #7C8999;
8. border-right:1px solid #7C8999;
9. }

Die Stelle sieht dann so aus:

1. #ancillary{
2. padding:20px 0 0 0;
3. background: #415262;
4. min-height:440px;
5. height: auto !important;
6. height: 440px;
7. color:#8798A8;
8. border-top:6px solid #7C8999;
9. border-left:1px solid #7C8999;
10. border-right:1px solid #7C8999;
11. }

Ein einfacher schmerzfreier Hack:

1. min-height:440px;
2. height: auto !important;
3. height: 440px;

Zunächst einmal min-height für alle modernen Browser, dann die eigentlich überflüssige Anweisung “height: auto” welche standardmäßig vorliegt, weil aber gleich im Anschluß diese überschrieben wird, hier noch ein “!important” ergänzt, denn der IE<7 hat nicht nur ein Problem mit min-height, er hat glücklicher weise auch ein Problem mit "!important", während andere Browser das "!important" ernst nehmen. Eleganter und zukunftssicherer wäre es über conditional comment ein Stylesheet für den IE zu nehmen und dort die height anzugeben, damit könnte auf das "height: auto !important" verzichtet werden, aber dazu war ich zu faul und die meisten, die wie ich das Gespaa verwenden, werden diese Ergänzung über die eingebaute Editierfunktion des Styles schnell vornehmen können.

Wer sich mein Anderungen im Quelltext genauer anschaut, wird noch zwei Anderungen feststellen, diese aber sind nicht relevant um das Problem zu flicken, sondern eher nicht bereinigte Reste meiner ersten Versuche.

Zum einen ist das in der sidbar.php in der letzten Zeile ein <div class="clear0"></div> und zum anderne im Stylesheet das dazu passende "clear0":

1. .clear0 {
2. clear: both;
3. height: 0px;
4. width: 0;
5. overflow: hidden;
6. }

Aber wie gesagt, das wird man nicht brauchen. Schon die erste Anderung sollte dem Big-Foot ein felxibleres Verhalten geben.

Filed under: HTMl&CSS
No Comments