Problème mise en page 2 colonnes avec image de fond

Bonjour,

Cela va faire deux petites semaines que j'ai découvert les joies du css et tout autant que je consulte ce forum pour trouver les réponses à mes interrogations.

Je me trouve néanmoins confrontée à un problème que je n'arrive pas à resoudre par la lecture des tutoriels et des posts. J'ai vu que certaines personnes avaient eu des problèmes similaires mais le fait d'essayer les solutions proposées ne m'a pas permis de progresser. Je finis par y perdre mon latin et à ne plus rien comprendre à ce que je fais. C'est pourquoi je me permet de venir poser la question même si elle peut sembler basique à des personnes plus expérimentées.

Voilà un screenshot de l'état actuel du site sur lequel je travaille (basse qualité certes mais ca suffit pour voir l'aspect) :

http://heleni.papanicolas.club.fr/Sans%20titre-3.jpg

Je cherche à introduire une colonne de texte sur l'espace laissé blanc. Malheureusement, le texte se retrouve en dessous de l'image de fond et décale la bordure. Voilà le lien vers un screenshot :

http://heleni.papanicolas.club.fr/Sans%20titre-4.jpg

Quand à mon code, voici un extrait qui concerne la partie en question.

Code css

body {
    background-color:#FFFFFF;
	margin:0px;
    font-size: 10pt;
	font-family: Tahoma;
	font-weight: normal;
	color: #000066;
}

#fond {
	position:relative;
	}


#site {
	position:relative;
	margin:0px auto 0px auto;
	width:778px;
	height:auto;
	background-image:url(../img/fond.png);
	background-repeat:repeat-y;
}
#cadre {
	position:relative;
	width:738px;
	margin-left:20px;
	height:auto;
	background-image:url(../img/fond2.png);
	background-repeat:repeat-y;
}


#content {
	position:relative;
	width:500px;
	height:auto;
	margin-right:238px;
	margin-top:-15px;
	padding-right:15px;
	padding-left:15px;
	padding-bottom:15px;
	
}

#right {
	height:auto;
	width:238px;
	float: right;
        clear: right;
 }

Voici le code php :

<div id="cadre">
	<div id="content">
		<?php include($link); ?>
	</div>
		
	<div id="right">
		Test texte à droite
		Test texte à droite
		Test texte à droite
		Test texte à droite
	</div>
</div>	

Quelqu'un pourrait-il me signaler quelle est mon erreur ou bien où trouver l'information pertinente qui me permettrait de me corriger.

En vous remerciant de toute l'aide que vous pourrez m'apporter.

Casualis
Modifié par Casualis (17 Aug 2006 - 21:40)

Bonjour et bienvenue sur Alsacréations ,

A priori sans code complet, il faut que ton élément flottant soit en premier dans ton code html. Au delà, je pense qu'il faudrait que tu te familiarises un peu avec les différents types de positionnement pour mener à bien te mise en page: Comprendre le positionnement des balises en CSS et http://del.icio.us/Igor/cssp (les 3 articles d'Openweb).