Table to div

Hello, je suis en train de me mettre au CSS.

J'essaie donc de passer un design en HTML avec des tableaux en CSS avec des div donc.

Voici le design que j'essaie de passer en CSS:
http://www.js-ftp.info/All-TournamenT/

Dans l'ensemble je m'en sors "bien".

Voici mon soucis:

http://www.ftp-trakiss.info/css/

Mon probleme: les deux barres grises du côté se placent SUR le header. En gros il faudrait qu'elles soient décalés de 81px par rapport aux bords du header qu'on voit. Actuellement il est SUR l'image du header

J'ai fait quelques test sans trouver la raison

Lien direct pour le CSS : http://www.ftp-trakiss.info/css/style.css

Les codes de ces deux barres:

#left
{
	background-image: url(images/all-left.png);
	height: 768px;
	width: 81px;
	float: left;
	background-repeat: repeat;
}

#right
{
	background-image: url(images/all-right.png);
	height: 768px;
	width: 81px;
	float: right;	
	background-repeat: repeat;
}

D'ailleurs je ne comprend pas pourquoi si je met height: 100% la barre de s'affiche plus Impossible de faire un truc dynamique. j'ai du louper quelque chose


Avez vous une idée de comment résoudre ce soucis?
Modifié par trakiss (07 Oct 2006 - 02:14)

bonjour,

pour le css ,

html , body , #left , #right , #conteneur_body{height:100%;}

feuille de style en cascade , les valeurs attribués aux "parents" influent sur le comportement des enfants .

et tres rapidement , je vois dans le html :

<div class="bloc">
					
						<div id="header_sponsors"></div>	
							
							<div class="texte_blocs_back">
								<div class="texte_blocs">test</div>	
								<div class="texte_blocs2">test</div>

								<div class="texte_blocs">test</div>
								<div class="texte_blocs2">test</div>
								<div class="texte_blocs">test</div>
								<div class="texte_blocs2">test</div>
								<div class="texte_blocs">test</div>
								<div class="texte_blocs2">test</div>

							</div>
						
						<div class="footer_sponsors"></div>
								
					</div>

sans chercher a corriger , je dirais que la , tu n'as pas compris l'histoire "tableau , divite , semantique " , l'un ne remplace pas l'autre pour prendre le 3eme en adjectif , (debat ouvert depuis plusieurs années dejà me semble t-il) .
Ce morceau de code ressemble fort a une liste , alors pourquoi pas une liste ! ... dans un "div" pour y inyegre l'image du haut , l'"ul" pour l'image du bas et les item pour le contenu ?

pour les bordures , une autre technique consisterai a imbriqué 2 div , avec l'image en fond respectivement a droite pour l'un et a gauche pour l'autre , repétée sur la hauteurs . Le contenu etirerait les deux div imbriqués pour dessiné les bordures sur la hauteurs necessaire.


++
Modifié par gcyrillus (07 Oct 2006 - 11:31)

Merci le code CSS que tu m'as donné règle le problème. Je me doutais que le problemè venait d'une déclaration parentes sans avoir trouver laquelles posait probleme

Pour le problème sur l'utilisation de div, en fait c'est fait expret, c'étais plus rapide pour effectuer des tests

a écrit :
et les item pour le contenu

Qu'appelle tu des items ? Se sont dont mon cas des table c'est bien çà ?
Modifié par trakiss (07 Oct 2006 - 14:59)

re
heu, ... item de liste , la balise <li> , desolé pour la confusion.
++