Message d'accueil: positionnement des blocs

[Muñeko]

Bonjour, bonjour!

Je pense que la question n'a pas été posée, mais on ne sait jamais: c'est peut-être juste une erreur de mots-clef de ma part (et dans ce cas, désolée...).

Donc, voici le problème: dans mon message d'accueil, j'essaie de positionner des blocs par-dessus une image, mais au lieu de prendre pour origine le coin haut-gauche du premier bloc pour origine, ils prennent celui de l'écran.

En rouge les éléments en vadrouille, en vert, là où ils devraient se décider à venir:


Je suis administratrice non-fondatrice sur phpBB3, aucun template n'a été modifié mais j'ai dû bricoler et tâtonner avec le CSS avec quoi j'ai un peu improvisé pour faire disparaître le fond du message d'accueil (c'est peut-être la raison de cette dispersion, mais la hauteur du message est restée inchangée).

Adresse du forum.

J'utilise Firefox, Chrome et Opéra.

En espérant avoir été assez précise, merci d'avance pour votre aide. :-)

[XxSven]

C'est possible de voir le code que tu as utilisé pour mettre l'image par dessus s'il te plait :p ?

[Muñeko]

Voici!

Code:

.accueil
{
  font-family: Georgia;
  color: #000000;
  margin: -20px;
  width: 1000px;
  height: 800px;
  background-image:url(http://img707.imageshack.us/img707/6548/texture1i.jpg) !important;
   background-position:0 0 100%;
   background-repeat:no-repeat;
   background-attachment:fixed;
  z-index: 1;
}

[XxSven]

Mais si j'ai bien compris le code tu as mis le texte avec .accueil comme class?
Il ne faut pas plutôt donner le nom de class de ta div qui contient le texte pour le modifier?

[Muñeko]

Non, j'ai mis d'autres balises à l'intérieur de "accueil", voilà le CSS:

Code:

.contexte
{
  width: 240px;
  height: 270px;
  position: absolute;
  left: 10px;
  top: 90px;
  overflow: auto;
}

.staff
{
  width: 190px;
  height: 130px;
  position: absolute;
  left: 600px;
  top: 235px;
  overflow: auto;
}

[XxSven]

La positionnement absolute se référence toujours à la page et non au block dans lequel il est.
Utilise plutôt

Code:

position: relative;
left: 10px;
top: 90px;

Pour le placer 10px à droite et 90px plus bas de sa position d'origine.

[Muñeko]

Ah, merci! ^^ Je tâtonnerai moins!