28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un tableau de deux colonnes. Dés que je rajoute un élément "décoratif" qui s'étale sur une ligne et donc sur les deux colonnes, il y a une ligne de séparation qui se crée.

En d'autres termes, quand je met un background, un border-bottom: 3px double #000000;, ... il y a un espace vide qui se crée entre les deux colonnes, on le retrouve sous Firefox, Internet Explorer et Safari, mais pas sous Opera.

Une image étant plus clair qu'un discours, voici une capture du problème :
upload/17168-tableau.jpg

Comment puis-je faire en sorte de supprimer cette ligne blanche ?

D'avance merci de vos réponses.



xenos
Modifié par xenos (13 Jul 2008 - 13:59)
Bonsoir xenos,

Je pourrai éventuellemnt te diriger vers la propriété border-collapse, mais je ne suis pas sûr que c'est de cela dont il s'agit (tu parles de background et de border...), ni ne sais si cela pourrait résoudre ton problème...

Pourrais-tu poster ton code (x)html/css ou éventuellement une page en ligne de manière à pouvoir te répondre plus efficacement ?

Cdt,
Sylvain
Voici le code

<table class="tableau">
	<tbody>
		<tr> 
			<th class="tableau_deux">Tableau de test</th>
			<th class="tableau_deux"><br /></th>
		</tr>
		<tr>
			<td>1</td>
			<td>2</td>
		</tr>
		<tr>
			<td class="colore">A</td>
			<td class="colore">4</td>
		</tr>
	</tbody>
</table>


table .tableau
{
	align: center;
	/* 0.5% pour centrer le tableau - 1em rajouté à tous les éléments du corps */
	margin: 0 0.5% 1em 0.5%;
	text-align: left;
	width: 99%;
}

th
{
	border-bottom: 3px double #000000;
}

.tableau_deux
{
	width: 50%;
}

td.colore
{
	background-color: #e9edf2;
}
6l20 a écrit :
Je pourrai éventuellemnt te diriger vers la propriété border-collapse, [...]


En effet, c'est ce qu'il me fallait. Ça fonctionne maintenant.

Merci et bonne soirée.
Modifié par xenos (11 Jul 2008 - 21:22)
Re,

Effectivement, c'est bien cette propriété qui devrait solutionner ton petit soucis Smiley cligne
Par contre tu as quelques étrangetés dans ton code, je ne sais pas quel Doctype est attaché à ta page, mais dans le doute les liens qui suivent devraient t'aider à produire un code conforme et standard :
Openweb
Mammouthland
La bible traduite par Yoyodesign

Manque un "u" à résolu Smiley lol

Bonne continuation,
Cdt
Sylvain
Des étrangetés ?

Mon code est donc si attroce que ça ? Smiley langue

Pour le "u" de résolu, j'aurais aimé le mettre, mais il semblerait qu'il y ait un nombre maximum de caractères pour le titre, alors c'était soit le "u" qui s'envolait ou une autre lettre ... la décision fût dure à prendre, mais je la maintient ! :d
xenos a écrit :
Des étrangetés ?
Mon code est donc si attroce que ça ? Smiley langue
Pour le "u" de résolu, j'aurais aimé le mettre, mais il semblerait qu'il y ait un nombre maximum de caractères pour le titre, alors c'était soit le "u" qui s'envolait ou une autre lettre ... la décision fût dure à prendre, mais je la maintient ! :d

Non pas tant que cela Smiley cligne
align: center;
quel est le but de l'opération (cela n'existe pas en css, du moins à ma connaissance...)

Après, le reste, c'est du chipotage de balisage (thead,tbody,éventuellement tfoot), d'accessiblité (summary,caption,...) bref, un peu le thème de ce forum Smiley cligne

Pour le titre de ton sujet et l'impossibilité de rajouter un caractère supplémentaire, ce n'est pas bien grave et je te félicite pour ton choix cornélien et ton engagement à défendre ta prise de décision Smiley jap

Cependant, un choix de titre plus "judicieux" pourrait résoudre ce "différent" qui nous "oppose" :
Espace indésirable entre les colonnes(ou cellules) d'un tableau
par exemple, suffirait à améliorer les recherches futures des potentielles âmes égarées dans les ténèbres, tout en assurant un "résolu" digne de ce nom ! Smiley cligne

Cdt,
Sylvain