<div> mittig zentrieren

So ziemlich jeder HTML-Entwickler stand schon einmal vor demselben Problem: Wie zentriert man ein <div> oder anderes Block-Element genau mittig auf der Seite?

Erstellen wir uns erst einmal ein HTML Grundgerüst:

View Code XML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Zentriertes Div</title>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	</head>
	<body>
		<div class="centered">
			<p>Text, der genau in der Mitte der Seite platziert ist.</p>
		</div>
	</body>
</html>

Jetzt brauchen wir noch ein wenig CSS und schon sind wir fertig:

View Code CSS
.centered {
	position: absolute;
	width: 512px;
	height: 100px;
	top: 50%;
	left: 50%;
	margin-left: -256px;
	margin-top: -50px;
	border: 1px solid #000000;
	background-color: #eeeeee;
}
.centered p {
	text-align: center;
}

Zentriertes Div
Der interessante Teil ist das „margin-left: -256px;“ bzw. das „margin-top: -50px;„, denn ohne die negativen Margin-Werte, würde das Zentrieren nicht funktionieren.
Achtung: Wenn sich die Breite oder die Höhe des Div-Containers ändert, müssen die Margin-Werte ebenfalls angepasst werden. Die Margin-Werte ergeben sich immer aus Breite/2 bzw. Höhe/2. Würden wir die Breite z.B. auf 200px reduzieren, muss das margin-left mit -100px angegeben werden.

NetBeans für PHP – Alternative zu Eclipse PDT

Auch als PHP-Entwickler darf man über den Tellerrand hinweg schauen und sich mit anderen Sprachen beschäftigen. Eigentlich habe ich nach einer vernünftigen IDE für Python gesucht, doch gefunden habe ich NetBeans – eine IDE, die vielleicht noch besser ist als Eclipse PDT!? In Deutschland ist NetBeans bei PHP-Entwickler noch relativ unbekannt, daher stelle ich NetBeans einfach mal vor. » Weiterlesen

Klassen-Konstanten in PHP 5.3

Seit PHP Version 5.3 gibt es einige Verbesserungen bei den Klassen-Konstanten. Hier mal ein kleines Beispiel:

View Code PHP
abstract class Auto
{
    public function getAutoName()
    {
        return self::AUTO_NAME;
    }
}
 
class Golf extends Auto
{
    const AUTO_NAME = "Golf";
}
 
$auto = new Golf();
echo $auto->getAutoName();

Wer dieses Beispiel in PHP 5.2 ausführt, bekommt eine Fehlermeldung „Fatal error: Undefined class constant ‚AUTO_NAME‘ in /htdocs/test.php on line 7“. Der Grund ist einfach: Die Konstante AUTO_NAME kann nicht von der Eltern-Klassen aufgerufen werden. Jetzt kommen wir zur Neuerung in PHP 5.3. Wir ändern lediglich eine Kleinigkeit:

View Code PHP
abstract class Auto
{
    public function getAutoName()
    {
        return $this::AUTO_NAME;
    }
}
 
class Golf extends Auto
{
    const AUTO_NAME = "Golf";
}
 
$auto = new Golf();
echo $auto->getAutoName();

Aus dem self:: wird ein $this:: und schon gibt uns PHP das richtige Ergebnis aus. Außerdem könnte man die Konstante noch direkt über das Objekt ausgeben mit $auto::AUTO_NAME, aber auch das ist erst seit PHP 5.3 möglich.