---
title: "H1 im DIV Layer wird nicht mittig ausgerichtet"
url: "https://www.typo3.net/d/97813-h1-im-div-layer-wird-nicht-mittig-ausgerichtet"
source: "typo3.net"
tags: ["Frontend","Styling","Frage","HTML & CSS"]
created: "2010-03-26"
last_reply: "2010-03-30"
replies: 2
solved: false
page: 1
pages: 1
lang: "de"
---

# H1 im DIV Layer wird nicht mittig ausgerichtet

Frontend › Styling · 2 Antworten · gestartet 2010-03-26

## Eröffnungsbeitrag

**ms_wombel** · 2010-03-26 · [Beitrag #1](https://www.typo3.net/d/97813-h1-im-div-layer-wird-nicht-mittig-ausgerichtet/1)

Hallöle,

ich habe da ein kleines Problem, bei dem ich auch nach vielen Googlen nicht klar komme.
Ich habe einen DIV Layer für einen News Bereich, deren Überschrift mittig ausgerichtet werden soll

Hier mal der Auszug aus dem HTML Template:

```html
<div id="contentcontainer">
   <div style="clear:both"></div>
      <div id="newscontent">
          <h1>Überschrift typ 1 -2</h1>
   	     <h2>Überschrift typ 2-2</h2>
	         <p>Lorem ipsum dolor sit .....
```

Nun definiere ich die H1 Klasse wie folgt:

	**#newscontent h1 {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #e8b563;
		background-color: #741518;
		text-align:center;
		vertical-align:baseline;
		background-image:url(images/newsh1back.jpg);
		background-repeat: no-repeat;
		border-bottom-width: 1px;
		border-bottom-style: solid;
		border-bottom-color: #741518;
		height:25px;
		}**

Leider heftet die Überschirft immer am oberen Rans des DIV Containers **#newscontent** . Wenn ich nun mit padding oder margin  arbeite, wird der ganze div Container veschoben und wird dann ausserhalb des Hauptcontainers  **contentcontainer**  angezeigt. Da der  **contentcontainer**  jedoch als Hauptcontainer drumherumliegt, komme ich gerade nicht weiter.  Hier mal die CSS von dem "umliegenden DIV Container".
**#newscontent {
	width:250px;
	float:right;
	margin-left:10px;
	margin-right:10px;
}**

Kann mir einer bitte sagen was ich flasch mache???

Es dankt.
der Wombel

## Antworten

### [#2](https://www.typo3.net/d/97813-h1-im-div-layer-wird-nicht-mittig-ausgerichtet/2) · kati · 2010-03-29

...vertical-align funktioniert meines Wissens nach im H1-Tag nicht. Ich würde einfach ein Div drumherumlegen und diesem die Hintergrundfarbe, -image etc zuweisen.

so ungefähr:

```html
#newscontent {
   width:250px;
   float:right;
   margin-left:10px;
   margin-right:10px;
}

#newscontent_h1{
   background-color: #741518;
   border-bottom-width: 1px;
   border-bottom-style: solid;
   border-bottom-color: #741518;
   text-align:center;
   background-image:url(images/newsh1back.jpg);
   background-repeat: no-repeat;
   height:25px;
   line-height : 25px;
   vertical-align : baseline;
}

#newscontent_h1 h1 {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 12px;
   color: #e8b563;
}	
	
<div id="contentcontainer">
   <div style="clear:both"></div>
      <div id="newscontent">
         <div id="newscontent_h1">
	    <h1>Überschrift typ 1 -2</h1>
	 </div>
	 <h2>Überschrift typ 2-2</h2>
         <p>Lorem ipsum dolor sit </p>
      </div>
   </div>
</div>
```

liebe Grüße Katja

### [#3](https://www.typo3.net/d/97813-h1-im-div-layer-wird-nicht-mittig-ausgerichtet/3) · ms_wombel · 2010-03-30

#angry#

Joh so sieht's gut aus - nun muss ich nur doch die anderen Darstellungsprobleme lösen

Danke

---

Quelle: „H1 im DIV Layer wird nicht mittig ausgerichtet“, typo3.net, https://www.typo3.net/d/97813-h1-im-div-layer-wird-nicht-mittig-ausgerichtet
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.