Ajouter deux lignes pointillées verticales

Bonjour à tous,

Comment ajouter deux lignes pointillées verticales qui séparent trois divs (gauche, centre, droite) ?

Parce que dans ce code, la hauteur des lignes reste relative au contenu de la div centrale, mêmes si la hauteur des div gauche et droite sont plus longues que celle du div centre :

#left, #center, #right {
	padding: 10px;
	float: left;
                text-align: left;
}
#left {
	width: 150px;
background-color: #FFFF66;
                /*border-right:1px dotted #999933;*/
}
#center {
	width: 408px;
	border-right: 1px dotted #666666;	
	border-left: 1px dotted #666666;
	padding: 10px;
}
#right {
	width: 150px;
	background-color: #FFFF66;	
	/*border-left:1px dotted #999933;*/
}

Merci

Bonjour,

Dans la pratique cela revient à faire des colonnes de même hauteur, ou à en simuler. Les solutions sont donc:

1. Utiliser des blocs en display: table-cell.
2. IE 6 et 7 ne supportant pas cette valeur de la propriété display, basculer sur des éléments HTML qui ont déjà ce type de rendu. En termes plus profanes: utiliser un tableau de mise en page, avec une ligne (TR) et trois cellules (TD).
3. Ou alors simuler des colonnes de même hauteur grâce à la technique des colonnes factices (image de fond répétée en hauteur sur un conteneur qui regroupe les trois colonnes).
4. Utiliser JavaScript pour égaliser les hauteurs des trois blocs (nivellement vers le haut).
Modifié par Florent V. (07 Dec 2008 - 03:20)

Bonsoir Florrent,

J'ai bien enttendu parler des "colonnes factices" ou il faut une image de fond qui se repete dans une div conteneur des trois colonnes.

Mais tout il faut trouver cette image, puis faire les réglages necessaires pour coller les colonnes à l'image.

tu as des colonnes de largeur fixe, donc c'est très facile de créer l'image de fond avec un éditeur d'image (même paint peux suffire pour une image comme ça). Pour "coller les colonnes à l'image", là encore comme tu as des largeurs fixes c'est très facile, tu sais exactement où mettre les pointillés. Vu la CSS que tu donne je dirais 160, 578 et 738 px pour que les lignes soient au milieu des espaces entre tes blocs.