Schlagwort: HTML

Schicke HTML Tabellen mit CSS

Der Artikel „Top 10 CSS Table Designs“ zeigt, wie man schnöde HTML-Tabellen mit CSS richtig schick machen kann. Im Anhang befindet sich eine „schnöde“ HTML-Tabelle nach dem Standard des W3C sowie eine schicke Tabelle mit abgerundeten Kanten.
Schicke HTML Tabellen mit CSS weiterlesen

HTTP-POST Request mit JavaScript

Häufig wird in Foren gefragt, wie man mit JavaScript gezielt Daten über einen HTTP-Request an eine bestimmte Datei senden kann. Weil dieser Vorgang in der Web-Entwicklung besonders wichtig ist, habe ich ein kurzes Beispiel programmiert, dass diese Funktionalität besitzt.
HTTP-POST Request mit JavaScript weiterlesen

IE8 mit IE7 – Verhalten

Bei der Darstellung von HTML-Elementen und CSS-Formatierung gibt es zwischen dem Internet Explorer 8 und dem Internet Explorer 7 gravierende Unterschiede. Besonders die verschiedene Interpretation von Abständen (padding, margin) bereiten Web-Entwicklern große Probleme.

Sehr oft musste man Conditional Comments benutzen, um die verschiedenen Anzeigen zu bewältigen. Doch damit ist jetzt Schluss! Microsoft hat im IE8 eine Funktion zur Abwärtskompatibilität eingebaut, so dass es möglich ist, das Anzeigeverhalten vom IE8 auf das Anzeigeverhalten vom IE7 einzustellen.

Dafür ist nur folgender Code nötig:

<html>
<head>
  <!-- Mimic Internet Explorer 7 -->
  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
  <title>Titel</title>
</head>
<body>
  <p>Diese Webseite sieht im IE8 so aus wie im IE7.</p>
</body>
</html>

DIV im IE zentrieren

Falls der Internet Explorer die Angabe margin: auto; zum Zentrieren von DIV-Containern nicht befolgt, dann hilft dieser Trick:

#container
{
	position: relative;
	width: 600px;
	left: 50%;
	margin-left: -300px;
}

Mit left: 50%; wird der Container um 50% des Anzeigebereichs nach rechts verschoben. Das ist etwas zu viel, deshalb muss man die halbe Breite bei margin-left angeben, um die Verschiebung auszugleichen und das DIV mittig zu positionieren.

Link-Text durch Grafik ersetzen

Möchte man in einem vorgegebenen Link den Text unsichtbar machen und durch ein Hintergrundbild ersetzen, so ist das Erste was einem einfällt color: transparent; für die Linkfarbe. Leider ist diese Eigenschaft nicht spezifiziert in CSS 2.1.

Trotzdem möchte ich eine Möglichkeit zeigen, die nach CSS 2.1 gültig ist und im Internet Explorer 6-8 sowie im Mozilla Firefox funktioniert.
Link-Text durch Grafik ersetzen weiterlesen