Peruns Weblog - Webwork und Internet

Ist das private Weblog von Vladimir Simovic mit Berichten zum Thema WordPress, Webwork, und Internet. Ich wohne in Köln und arbeite als freier Webworker, Blogger und Autor.

Die Kategorie "HTML-CSS"

Hier sind alle Beiträge aufgelistet, die in die Kategorie HTML-CSS einsortiert wurden. Die Beschreibung dieser Kategorie lautet:

Berichte zu (X)HTML und CSS

Du hast die Möglichkeit den RSS-Feed speziell nur für diese Kategorie zu abonnieren.

Fehlverhalten von IE im Boxmodell

Von Perun am 04. Juli 2004 um 14:31

In diesem Bericht wird beschrieben wie man das fehlerhafte Verhalten vom Internet Explorer in Bezug auf das Boxmodell berichtigen kann (richtiges Doctype, Tanteks Hack etc.) und auch welche Probleme sich evtl. ergeben können, wenn man die eine oder andere Lösung anwendet.

Ich habe vor einigen Monaten diesen Bericht geschrieben, aber mittlerweile sind einige neue Infos dazugekommen und hiermit will ich es aktuallisieren. In diesem Bericht werde ich mich nur auf das fehlerhafte Verhalten von IE (Win) beziehen.

(weiterlesen…)

Zentrierter CSS-Frame

Von Perun am 03. Juli 2004 um 14:27

Ich habe einige Zeit dieses Thema verfolgt, aber es irgendwann abgehackt weil es zu buggy und kompliziert war. Jetzt habe ich allerdings eine Quelle gefunden wo sowas relativ einfach erklärt wird.

Worum geht es? Mit CSS hat man eine einfache Möglichkeit Bereiche zu fixieren und wiederrum für andere Bereich die Scrolleigenschaft zu aktivieren. Somit simuliert man die positive Eigenschaft (ohne die negativen Aspekte) von richtigen Frames. Aber wie wir das schon von vielen anderen guten Beispielen kennen, einige der Browser (ich sage jetzt nicht Internet Explorer, sonst wiederhole ich mich zum tausendsten mal :-)) verweigern hierbei ihren Dienst.

Auf www.aplus.co.yu (keine Sorge, der Text ist in englisch *g*) habe ich ein gutes Beispiel gefunden welches in IE/Win ab 5.x, Geckos, Safari 1.2 und Opera 7.51 funktioniert. Opera 6 und IE/Mac 5.x wollen nicht.

Hier geht es zum Beitrag.

CSS-Kurzschreibweise

Von Perun am 25. Juni 2004 um 21:03

Auch in CSS besteht die Möglichkeit bestimmte Anweisungen zusammenzufassen und/oder sie verkürzt zu schreiben. Dies macht die Datei um einiges kleiner und übersichtlicher.

(weiterlesen…)

SelfHTML-Validator

Von Perun am 17. Juni 2004 um 19:52

Valid XHTML 1.0 SelfHTML hat einen eigenen Validator auf die Beine gestellt. Damit kann man HTML-, XHTML-, XML- und WAP/WML-Dokumente validieren. Voraussetzung für den Einsatz: das Dokument muss online sein und über eine gültige DOCTYPE-Angabe verfügen. Laut den Entwicklern wird bei Fehlern und Warnungen auch auf die jeweiligen Stellen innerhalb des SelfHTML-Kompendiums verwiesen.

XHTML- und CSS-Sidebar

Von Perun am 11. Juni 2004 um 23:59

Die neue XHTML- und CSS-Sidebar von SelfHTML Ich sollte wohl öfter SelfHTML besuchen. Denn seit dem 25. Mai werden dort u.a. CSS- und XHTML-Sidebars angeboten.

Es werden Geckos (Mozilla, Netscape ab 6.x und Firefox), Opera und IE ab 5.5 unterstützt. Sidebar ist (zumindest in Mozilla, mit den Sidebars der anderen Browser habe ich keine Erfahrung. Vermute mal schwer das es identisch ist.) eine Anwendung die es erlaubt Inhalt von anderen Websites zu betrachten ohne auf dieser Homepage zu sein.

Aktueller Menuepunkt

Von Perun am 01. Juni 2004 um 22:02

Ich habe in letzten Tagen nach einer einfachen Lösung gesucht, wie man das Problem des anzeigens des aktuellen Menüpunktes in der Navigation lösen kann.

Dabei sind mir zwei Berichte relativ positiv aufgefallen:

Der erste Bericht setzt auf die PHP-Lösung in der man jeder Unterseite schon am Anfang eine eindeutige Kennung in Form einer Variable verabreicht. Dies macht man sich dann zum Nutzen nicht nur für die Bestimmung der aktuellen Seitenposition sondern auch für andere Zwecke (angepasster Seitentitel etc.).

Der zweite Bericht setzt auf eine pure CSS-Lösung (war mir bis dato unbekannt). Man verabreicht in jeder Unterseite ein <body id="eindeutige-kennung"> und auch jedem Menüunterpunkt auch eine eigene ID. In der CSS-Datei tätigt man folgende Anweisung:


body#eindeutige-kennung li#kennung {
Angaben zum Hervorheben;
}

Ich habe die beiden Berichte zusammengefast und im Wiki bereitgestellt:

Bei dem zweiten Bericht habe ich auch eine Lösung aufgeschrieben die ich bis jetzt verwendet habe welche auf $_SERVER['SCRIPT_NAME'] basiert.

Hilfe! Layouttabelen

Von Perun am 17. Mai 2004 um 01:40

Auf Mezzoblue gibt es einen interessanten Artikel mit dem Namen Tables? Oh, the horror!. Ich persönlich finde ihn sehr interessant, denn soweit mich mein „broken english” :-) nicht täuscht ist der Autor (Dave Shea) der Meinung, daß man in bestimmten Situationen und unter bestimmten Voraussetzung eine einfache Layouttabelle (keine dreifach verschachtelte Tabellenmonster) evtl. in Betracht ziehen könnte (weiteres dazu im Artikel). Und zwar eine Layouttabelle nach folgendem Muster:


<table cellspacing="0">
<tr>
<td>
Linke Spalte
</td>
<td>
Mitte
</td>
<td>
Rechte Spalte
</td>
</tr>
</table>

Dabei betont er das es nur um eine solche einfache Tabelle geht (und um keine mehrfach verschachtelte Tabellen) damit das Layout „zusammengehalten” wird. Er betont diesen Satz mehrmals, da er von einigen Leuten für seinen letzten Beitrag Gasp! Tables! ziemlich viele verbale „Prügel” einstecken musste.

Ich sehe das alles etwas pragmatischer und unverkrampfter. Natürlich sind Tabellen nicht für das Layout sondern für tabellarische Daten gedacht (Stundenpläne, Fahrpläne, Kalender etc.). Und natürlich bieten pure CSS-Layouts mehr Vorteile und vielfältigere Möglichkeiten. Aber ich mache keinem Vorwurf der aus verschiedenen Gründen (Zeitdruck, Browserinkompatibilitäten, komplexe Vorlage des Grafikers, etc.) dann doch zu dieser einfachen Layottabelle greift. Dazu fand ich folgende Aussage passend:

You will probably hear some accessibility adovcates say that layout tables are a bad idea, and that CSS layout techniques ought to be used instead. There is truth in what they say, but, to be honest, using tables for layout is not the worst thing that you could do in terms of accessibility. People with all kinds of disabilities can easily access tables, as long as the tables are designed with accessibility in mind.

[Quelle: Creating accessible tables]

Obwohl ich zwar nicht die Erfahrung von Dave Shea habe, aber bei einigen Experimenten an verschiedenen Templates war ich doch kurz davor zu einer Layouttabelle zu greifen. Da gibt es noch viele Probleme, die meist an den unzulänglichkeiten der Browser basieren (Internet Explorer tut sich hier besonders vor). Am meisten hat mich der „3 pixel Gap”-Bug geärgert der bei floatenden Layouts im IE entsteht. Und da stellt sich einfach die Frage was ist in solchen Fällen schlimmer/besser? Eine einfache Layouttabelle (vorausgesetzt man befolgt einige Regeln s. u. die Links) oder mehrere CSS-Hacks? Hinweis: ist keine rhetorische sondern ernstgemeinte Frage.

Wer sich dann doch für eine Layouttabelle entscheidet und schon mal die gröbsten Fehler in Sachen Zugänglichkeit vermeiden will, der sollte folgende Seiten besuchen:

« 1 ... 8 9 10 11 12 ... 13 »