Zurück zur Homepage

KS Webdesign - Der Blog

CSS – Ordnung 2

28. August 2009 von Klaus · Kommentare (1)

Im letzten Artikel CSS – Ordnung 1 habe ich etwas über das Inhaltsverzeichnis einer CSS-Datei geschrieben und einen Vorschlag gemacht, wie die Abteilung Allgemeine Selektoren ausschauen könnte.

Hier möchte ich einen Vorschlag zur Reihenfolge der Deklarationen in einem Deklarationsblock machen. Weiterlesen

CSS – Ordnung 1

28. August 2009 von Klaus · Kommentare (3)

Eine CSS-Datei kann je nach Website schon mal 1000 Zeilen erreichen, vorausgesetzt man organisiert sie übersichtlich.

Dabei kann ein Inhaltsverzeichnis sehr hilfreich sein. Die damit verbundene Mehrarbeit lohnt sich auf jeden Fall. Sollte man bei der mühevoll erstellte Website nach einem Jahr Änderungen durchführen müssen, hat man durch das Inhaltsverzeichnis sehr schnell den Überblick was wo steht. Weiterlesen

Navi – Dropdown

20. August 2009 von Klaus · Kommentare (5)

Tutorial zur Erstellung eines einfachen Dropdown-Menüs mit XHTML/CSS und etwas Javascript für den IE 6. Weiterlesen

Zitate in Kommentaren

14. August 2009 von Klaus · Kommentare (0)

Als Kommentierender in anderen Blogs zitiere ich manchmal den Autor oder einen der anderen Kommentierenden. Dazu nutze ich z.B. den Button Zitat, den man öfter über dem Textfeld findet, wo man den Kommentar reinhackt. Oder ich fasse das Zitat direkt in <blockquote> ein, was auf das Gleiche hinausläuft.

Nachdem der Kommentar eingetragen ist stelle ich leider öfter fest, daß das Zitat optisch kaum oder gar nicht hervorgehoben ist, was meist dann nicht so toll ausschaut. Weiterlesen

Foot Sticker Alt

11. August 2009 von Klaus · Kommentare (10)

Foot-Sticker-Alt ist eine Technik, mit der man den Fußbereich einer Webseite am unteren Bildschirmrand fixieren kann, auch wenn die Seite wenig Text enthält. Weiterlesen

Stapelung 1 – Mit und ohne z-index

10. August 2009 von Klaus · Kommentare (7)

Ich weiss nicht ob es euch schon mal so gegangen ist:

Eine schönes Design mit Dropdown-Navi und sich überlagernden Elementen hurtig entworfen. Frisch gecodet, im Browser angeschaut und festgestellt, das die Dropdown-Navi hinter dem nachfolgenden Element aufklappt und somit unbenutzbar ist. Außerdem überlagern sich andere Elemente nicht so, wie du es dir gedacht hast.

Was tun??

Na klar, position:absolute; und /oder position:relative; hier und dort eingesetzt.

Noch immer nicht??

Okay, also wird massiver positioniert. Die ersten z-index tauchen auf. Bei Elementen die auf jeden Fall vorne sein müssen gleich zur Sicherheit mal z-index:5000; vergeben, damit das auch sicher klappt.

Es geht trotzdem nicht??

Nun wird nach der Trial und Error-Methode wild herumpositioniert und mit z-index nur so um sich geworfen. Ein Hauch von Verzweiflung liegt in der Luft.

Was kann ich bloß tun, damit Wunsch und Ergebnis eins werden?

Stapelung ist kein leichtes Thema, schon gar nicht wenn man alle Aspekte inklusive der üblichen Extrawürste für den Internet Explorer verstehen will.

Für den Anfang reicht es die Grundlagen zu verstehen und dabei soll dir dieses kleine Tutorial helfen. Weiterlesen

Conditional Comments 1 – Korrekturen für alle IE-Versionen in einer Datei

05. August 2009 von Klaus · Kommentare (13)

Mithilfe von Conditional Comments kann man dem Internet Explorer besondere Gestaltungsanweisungen zukommen lassen, die auch nur von ihm interpretiert werden. Zuerst erstellt man eine CSS-Datei und speichert sie unter dem Namen ie.css in dem Ordner ab, wo die anderen CSS-Dateien (bildschirm.css, druck.css) abgelegt sind.

In der XHTML-Datei wird unmittelbar vor dem Ende von </head> folgendes eingefügt:

  • <!--[if lte IE 8]>
  • <link rel="stylesheet" type="text/css" href="css/ie.css" media="screen" />
  • <![endif]-->

[if lte IE 8] heißt alle IE-Versionen, die kleiner oder gleich IE 8 sind. Da die verschiedenen Versionen des IE unterschiedliche Fehler haben, müssen die von dem Fehler betroffenen IE-Versionen auch innerhalb der ie.css gesondert angesprochen werden können.

Dazu gibt es folgende Möglichkeiten: Weiterlesen