CSS

Scrollbalken

Scrollbalken lassen zentrierte Seite springen

Unterschiedliche Contenthöhe erzeugt Scrollbalken

Bei Seiten mit wenig Content sind keine Scrollbalken vorhanden. Ragt der Inhalt einer Website jedoch über den sichtbaren Browser-Bereich hinaus, so entstehen Scrollbalken. Beim Durchklicken speziell bei zentrierten Homepages springt die Seite beim Wechsel zwischen wenig und…

Submit Button Cross Browser Angleichung

Submit Button Cross Browser Angleichung

Es ist kompliziert…

Um ein einheitliches Aussehen des Submit Buttons zu erzielen muss nicht nur im Internet Explorer getrickst werden sondern auch im Firefox. .submit { overflow: visible; /* IE */ width: auto; /* IE */ outline: 0; border: 0; cursor: pointer; white-space: nowrap;…

CSS-Linien Grid

Vertikale Linien

Für vertikale Raster eignen sich vertikale Linien mit CSS

<style type="text/css"> body { background: -webkit-linear-gradient(-90deg, #fff, #fff 23px, #f0f 24px); background: linear-gradient(180deg, #fff, #fff 23px, #f0f 24px); background-size: 100% 24px; } </style> Beispiel Gallia est…

first-child last-child Internet Explorer

Internet Explorer :first-child und :last-child

Expressions

Der Internet Explorer unterstützt :first-child erst ab Version 7 und :last-child erst ab Version 9. Mit Expressions kann man dies Problem lösen – aber dieser Ansatz ist mit Vorsicht zu genießen… :first-child <style type="text/css"> .box:first-child…

Internet Explorer 6 height und width ermitteln

Internet Explorer 6 height und width ermitteln

Expressions

Oft hat der Internet Explorer 6 Probleme bei der Berechnung von Breiten oder Höhen. Auch bei absoluter Positionierung entstehen je nach Struktur ungewollte Fehlinterpretationen. Hierbei können einfache Expressions hilfreich sein – doch Vorsicht bei der Verwendung. .testWidth…

Opacity Internet Explorer

Opacity im Internet Explorer

Opacity für den Internet Explorer 6 und 7 .box { filter: alpha(opacity = 50); } 50 steht für 50% oder opacity: 0.5;. Für manche Strukturen kann zoom: 1; hilfreich sein. Opacity für den Internet Explorer 8 .box {…

form Usability

form Usability

cursor: pointer; für form Elemente

Meistens verweist das label mit einem for auf die dazugehörige id. Wenn man nun mit der Maus auf das label klick landet man direkt im input-Feld. Hilf Deinen Usern in puncto Usability und zeige mit dem cursor auf diese interne Verlinkung. Auch Buttons benötigen diese…

Gepunktete Linie um Links im Internet Explorer entfernen

Gepunktete Linie um Links im Internet Explorer entfernen

Die Linkumrandung muss weg

Im Internet Explorer 8 und 9 (Vista und Windows7) werden Links beim Klicken gepunktet umrandet. Diese gestrichelte Linkumrandung konnte im Internet Explorer 6, 7 und 8 unter Windows XP mit a:focus {outline: none;} problemlos entfernt werden und die dotted border war…

Internet Explorer Conditional Comments

Browserweiche Internet Explorer

Conditional Comments

Da der IE häufig proprietäres CSS und zusätzlich alternative CSS-Definitionen benötigt sollte man eine Trennung von Standard-Stylesheets und Browserspezifischen Erweiterungen vornehmen um die Standard-Browser nicht zu beeinflussen. So werden die globalen Styles für den…

CSS quotes

CSS Zitate

<style type="text/css"> blockquote { padding: 20px; border: 1px solid #aaa; } /* „ “ ‚ ‘ */ q {quotes: "\201E" "\201C" "\201A" "\2018";} q:before { content: open-quote; opacity: .7; }…

Impressum