Hintergrundgrafik + Text gerät durcheinander

[Henk]

Hallo,
ich beschäftige mich neuerdings mit css und habe hier ein Problem mit einem Design, vielleicht kann mir jemand helfen.
Ich habe eine Hintergrundgrafik, die einen Kreis in die Mitte der Website bringt. In diesem Kreis befindet sich Text. Die Grafik habe ich so eingebaut:

<div style="background-image:url('hintergrund.jpg');background-position:top;width:100%;height:807px;">

die Textpassagen habe ich dann mittels css-sheet an ihre passende Position gepackt(es gibt noch mehr #text definitionen, aber die unterscheiden sich nur durch Position und Schriftgröße):

#text1 {
 font-family:sans-serif;
 font-size:50px;
 font-weight:bold;
 position: absolute;
 left: 340px;
 top: 220px;

}

Vermutlich könnt ihr euch schon denken wo das Problem liegt: Ändert man die Größe des Browsers wird der Text "ungeordnet", soll heissen das er nicht mehr in dem Kreis in der Mitte steht, sondern sich verschiebt, es entstehen Zeilenumbrüche, usw.

Hat jemand eine Idee, wie ich das umgehen kann? Kann man vielleicht mittels CSS einen Kreis in der Mitte erstellen, so dass ich kein riesen Hintergrundbild brauche?
vielen dank schonmal,
Henk

[kungschu]

Hallo.

Habe ich dich richtig verstanden? Du möchtest eine Webseite, wo horizontal wie vertikal zentriert ein Kreis mit Text als Inhalt angezeigt wird? Der Inhalt soll verschieden formatiert sein?

Dann schau dir mal die Dinge an:

-Zentrierung
-Hintergrund
-Schrift.

Definiere ein <div> in einer (externen) css:

-Zentriere es, gebe ihm das entsprechende Hintergrundbild, außerdem text-align:center;.
-Formatiere den Text über Klassen und nicht alles über die <div> id.

MfG, Kungschu.