Ulrike S.: Etwas nach rechts verschobener, zentrierter Text

Beitrag lesen

Liebe Selfhtml-Helfer,
ich hoffe einmal, dass mir als Newbie hier mit meiner Anfrage etwas Nachsicht entgegengebracht wird.

Ich habe mir von Fractatulum das 5. Beispiel heruntergeladen (ich finde die Sachen sehr schön und bin auch dankbar dafür) und angefangen es im CSS anzupassen. Bisher habe ich nur links und rechts den Abstand zum Fenster auf je 40px verkleinert und mich an den Kopfbereich herangemacht. Genau da ist mein Problem:
Oben in dem Kopfbereich, der im Original das blaue Rechteck oben ist, sollen zwei Grafiken sein, linksbündig von einem Gebäude, rechtsbündig mit 10px Abstand von rechts ein Logo. Mittig davon der Name des kleinen Vereins. Da dieses Layout je nach Fenstergröße mitskaliert, habe ich das folgendermaßen gelöst und das funktioniert auch zu 2/3:
Die Gebäudegrafik (300px breit) habe ich als Hintergrundbild des Kopfelements genommen, das Logo (85px breit) habe ich dann einfach als rechtsbündiges Bild mit 10px Abstand eingefügt.

Nur den Namen bekomme ich einfach nicht mittig im Verhältnis zu den zwei Grafiken (die eine Grafik ist ja breiter als die andere, also liegt die Mitte zwischen den zwei Grafiken nicht in der Mitte des divs). Ich habe ein <div> mit einer neuen id genommen und im CSS einen z-index genommen, und dazu in der CSS-Datei schon etliches versucht, aber entweder wird der Name genau zentriert angezeigt oder komplett nach rechts verschoben.

Dies war mein letzter Versuch:

#name{
 background: transparent;
 text-align: center;
 width: 100%
 z-index: 2;
 position: absolute;
 font: bold 20px verdana, sans-serif;
 margin: 21px 125px 15px 340px;
}

Der Text erscheint aber mit diesem CSS-Teil genau zentriert vom Kopfbereich, eben nicht zentriert in Bezug auf die beiden Grafiken.
Ich habe statt margin auch schon padding genommen, doch dann war das Ganze aus mir unerfindlichen Gründen ganz nach rechts verschoben, sodass unten eine Scrolleiste erschien. (Entschuldigung, ich habe den CSS-Code einfach nicht farbig bekommen)

Bitte nicht über die seltsame Reihenfolge wundern. Ich hoffe ich liege richtig, dass die Reihenfolge nichts ausmacht. Das ist so beim Ausprobieren entstanden. Ich arbeite mit Topstyle lite. Wenn ich mit Hilfe von hier (hoffentlich) die Lösung gefunden habe, dann sortiere ich das schon nach der Reihenfolge des Topstyle Lite Style Inspectors.

Bitte, ich bin absolute Amateurin, bekomme auch nichts vom Verein für die Seite. Durch berufliche Verbindungen einiger Mitglieder unterstützen sie vor Ort eine Schule in Afrika mit ihrem privaten Geld. Da inzwischen auch einige Leute aus dem Freundskreis mitmachen, die nicht mit am Ort wohnen, hätten sie gerne eine Webseite. Ich gehöre auch zum Freundeskreis und hab mich nun in die Sache gestürzt.

Ich bin für jeden Tipp, der mich zur Lösung des Problems bringt, sehr dankbar.

Gruß Ulrike S.