Zentrieren von Bildern und Überschriften

Cha0s · #1 (**permalink**) 02.10.2012, 10:20

Hi Leute,
ich bin beim erstellen meiner Website auf ein Problem in der Kopfleiste auf ein Problem gestoßen. Ich möchte das Bild zunächst nach rechts außen an den Rand bekommen und dann sowohl die Überschrift, als auch das Bild in dem grünen Kasten horizontal Zentrieren:

Nun um das bild nach recht zu Verschieben, könnte ich anhand der Breite der Überschrift einen Margin wert für das Bild errechnen, aber gibts da nicht eine einfachere Methode?

Zu dem Problem mit dem Zentrieren hatte ich mir überlegt, die Größe das Grünen Kastens mithilfe von Padding zu bestimmen, indem ich es für oben und unten gleich wähle. Nun wird aber nur das bild Zentriert und die Überschrift nicht, da sie nicht so hoch wie das Bild ist. Wie lässt sich dieses Problem lösen?

Hier mein HTML - Code:

HTML-Code:

<!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" xml:lang="de" lang="de">
<head>
<title></title>

<link rel="stylesheet" href="design.css" type="text/css">

</head>

<body>
<div id="kopfbereich">
    <h1>Das ist nur ein Test!</h1>
    <img src="bilder/herbst.jpg" alt="Das ist nur ein Test!"/>
</div>

</body>

</html>

Nun der CSS - Code:

Code:

* {
    margin: 0;
    padding: 0;
}

#kopfbereich {
    border-color: #00FF00;
    border-style: solid;
    height: 200px;
}

#kopfbereich h1 {
    border-color: red;
    float: left;
}

#kopfbereich img {
    width: 220px;
    height: 165px;
}

Ich hoffe ihr könnt mir weiterhelfen

Gruß

Jonas

hubspe · #2 (**permalink**) 02.10.2012, 10:52

da es sich um eine Schmuckgrafik handelt, gehört die in die CSS und nicht als img in den Quelltext.

Bitte einen Link zum Problem posten, wir können das Bild nämlich nicht sehen.

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
margin:0 auto; weiterer div-bereich zentrieren	seeadler	CSS	7	14.07.2008 21:00
Opera 9.x und Überschriften	laborix	CSS	9	17.03.2008 21:39
Bilder Zentrieren	Takko	CSS	4	04.03.2008 19:45
Zentrieren bei position:fixed	Alessia	CSS	3	26.02.2008 14:33
Bild vertikal zentrieren in Blockelement in IE nur m. TABLE	AndreasB	CSS	11	13.03.2006 17:05