28173 sujets

CSS et mise en forme, CSS3

Problème d'affichage de tableau sous Firefox

J'ai un petit soucis, Firefox (1.5) ne semble pas vouloir prendre en compte le style que je souhaite appliqué a un tableau.
Il ne veux par exemple pas m'afficher une bordure pour mon tableau et les cellules de celui-ci. Sous IE et Opera cependant aucun soucis

Le HTML :

<table id="liste">
			<tr>
				<td>Nom du fichier</td>
				<td>Date de dépot</td>
				<td>Date de retrait</td>
				<td>id utilisateur</td>
				<td>supprimer</td>
			</tr>
			
		</table>


et le CSS associé :

table#liste {
	border-style:solid; 
	border-width:1px; 
	border-color:#506388;
	width: 80%;
	border-collapse: collapse;
}

table#liste td {
	border-style:solid; 
	border-width:1px; 
	border-color:#506388;
}


Je ne comprend pas, j'ai essayé, comparé avec des exemple sur le net cela devrait pourtant fonctionner ainsi ?
Salut,
c'est plutot bizarre, car j'ai validé ton css sans problème et en essayant ton code aucun souci. Tu dois avoir une régle de prorité supérieur qui annule la portion de code que tu nous a transmis
ghost, pas moyen d'acceder à la page que tu me donnes, qu'est qui ne va pas stp.

Sinon voici mon css complet (je ne vois pas non plus ce qui pourrait annuler mes def de style pour les tableau :

body {
background-color: #C4CBD1;
margin: 0;
}

div#container {
width: 750px;
margin: 0 auto;
background-color:#C0D1EF;
}

div#header {
height:120px;
background-color: #C0D1EF;
background-image: url("header1.png");

}

div#left {
float:left;
width:20%
}

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
margin: 5px auto;
padding: 5px;
top: 1em;
left: 1em;
}

#menu dt {
cursor: pointer;
background: #F0F4FF;
/*height: 20px;*/
line-height: 20px;
margin: 10px 0;
border: 1px solid #506388;
text-align: center;
color: #506388;
}

#menu dd {
position: absolute;
z-index: 100;
left: 8em;
margin-top: -1.4em;
width: 10em;
background: #F0F4FF;
border: 1px solid #506388;
color: #506388;
}

#menu ul {
padding: 2px;
}
#menu li {
text-align: center;
font-size: 85%;
/*height: 18px;*/
line-height: 18px;
}
#menu li a, #menu dt a {
color: #506388;
text-decoration: none;
display: block;
}

#menu li a:hover {
text-decoration: underline;
}

#menu dt a:hover {
background-color: #C4CBD1;
}

div#content {
float:left;
position:relative;
width: 80%;
height:445px;
overflow: auto;
background-color: #FFFFFF;

text-align: justify;
/*text-indent: 20px;*/
color: #506388;
}

#content h2 {
text-align:center ;
color: #506388;
}

#content form {
margin: 0 auto;
width: 80% ;
}

#content form label {
	float: left;
	width:170px;
	text-align: right;
}

#content fieldset {
border: 1px solid #506388;
background-color : #F0F4FF;
}

#content legend {
	color:#506388; 
}

input {
margin-left: 20px;
}

table#liste {
	border-style:solid; 
	border-width:1px; 
	border-color:#506388;
	width: 80%;
	border-collapse: collapse;
}

table#liste td {
	border-style:solid; 
	border-width:1px; 
	border-color:#506388;
}

.important {
color: red;
}

div#footer {
clear:left;
height:25px;
background-color: #506388;
color: #F0F4FF;
}
Alors voici le code html correspondant à la page :

<body>

<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c" %>


<div id="container">
	<div id="header"></div>
	<div id="left">
		<c:import url="menuAdmin.jsp" /> 
	</div>
	<div id="content">
		<h2>Liste de l'ensemble des fichiers présent sur le serveur</h2>
		<table id="liste">
			<tr>
				<td>Nom du fichier</td>
				<td>Date de dépot</td>
				<td>id utilisateur</td>
				<td>supprimer</td>
			</tr>
			<c:forEach items="${requestScope['liste']}" var="fichier" varStatus="status">
				<tr class="${status.index%2==0?'pair':'impair'}">
					<td>${fichier.nom}</td>
					<td>${fichier.date}</td>
					<td>${fichier.user.nom} ${fichier.user.prenom}</td>
					<td><input type="checkbox" name="supprim" /></td>
				</tr> 
			</c:forEach>
			
		</table>
		
	</div>
	<div id="footer">
	Copyright Altheïs - GLB Group 
	</div>
</div>

</body>
</html>
Sujet clos
Aller à