Zum Inhalt springen

Überschrift mit unterlegter 2-geteilter Grafik???

Erstellt am 23. Mai 2008 · 2 Antworten · letzte Antwort am 16. März 2010

Tags: Inhaltselemente, HTML & CSS, Frage

anklein1 ·

Hallo alle zusammen!!

Ich will Überschriften mit Grafiken unterlegen und arbeite mit eigenen CSS. Die Überschriften sind je nach Inhalt unterschiedlich breit und deshalb habe ich einen linken und einen rechten teil der Grafik. Wie stelle ich es beim Einfügen des Inhaltes an dass auch noch <span> davor steht???
Hier der Teil der CSS

h2{
	font:1em/1em Arial, Verdana,sans-serif;
	margin:1em 0em 1em 0em;
	padding:0;
	height:auto;
	background:url(../fileadmin/images/h2-right.gif) top right no-repeat;
}

h2 span{
	font-weight:bold;
	color:#fff;
	padding:6px 8px 4px 8px;
	display:block;
	background:url(../fileadmin/images/h2-left.gif) top left no-repeat;
}

h2 span a{
	font-weight:normal;
}

Beim Betrachten des generierten Quellcodes in der Ansicht steht dann

<div class="csc-header csc-header-n1"><h2 class="csc-firstHeader">1. Geltungsbereich</h2></div>

dort stehen soll aber:

<h2><span>1. Geltungsbereich</span></h2>

Weis jemand wie das Problem zu lösen ist???

Vielen Dank für eure Antwort!

Liebe Grüße
Andreas

robhuhn ·

Würde es nicht auch gehen, wenn es eine Grafik ist, die immer wiederholt wird und rechts halt ein bisschen rausschaut?

h2{
        font:1em/1em Arial, Verdana,sans-serif;
        margin:1em 0em 1em 0em;
        padding:0;
        height:auto;
        background:url(../fileadmin/images/h2-ganz.gif) top left repeat-x; 
        padding-right: /*Breite von dem Zipfel, der rechts rausschauen soll*/
}

So hätte ich das gemacht...
Grüße
robhuhn