Problème de largeur ! [CSS] - HTML/CSS - Programmation
Marsh Posté le 17-01-2006 à 22:07:41
lol c'est du chipotage
Mais c'est vrai que même aprés quelques tests...rien trouvé...
Marsh Posté le 17-01-2006 à 22:12:57
tu dis que c'est du chipotage parce que ce n'est "qu'un" pixel, mais ça m'embete autant que si c'était 10pixels.
Je penche pour une clause du box-model. y a-t-il un expert dans la salle qui sache quoi faire ?
EDIT: Bon problème modifié: sous IE il y a également un décalage à droite à la manière d'Opera
Marsh Posté le 18-01-2006 à 10:09:40
ça j'en sais rien, mais j'aimerais déjà essayer de résoudre ce problème avec les 3 nabvigateurs cités ci-dessus
Marsh Posté le 18-01-2006 à 14:44:33
et si tu esaye de faire une bordure sur 3 pixel ca te mangera chaque pixel, enfin je dis ca mais je n'ai pas essayé...
Marsh Posté le 19-01-2006 à 15:02:28
la seule solution que j'ai trouvé jusqu'à présent c'est de mettre l'image du dessus dans une ligne de la table est de faire un colspan, mais bon j'ai banni le codage en table depuis longtemps, c'est pas pour y replonger
Marsh Posté le 17-01-2006 à 21:30:26
Bon voilà le topo,
J'ai une table et un div, tous deux sont dans un conteneur de largeur définie.
Mon problème:
Sous FF: la table est décalée de 1pixel vers la gauche
Sous IE : la table est décalée de 1pixel vers la droite
Sous Opera : idem qu'IE !
CSS
/*
-------------------
PROPRIETES GLOBALES
-------------------
*/
* {
font-family: Verdana, sans-serif;
padding: 0;
margin: 0;
}
p {
padding: 0.5em 0;
}
/*
----------------
BLOCS PRINCIPAUX
----------------
*/
body {
background: rgb(40,40,40);
text-align: center;
width: 100%;
}
#main {
margin: 0 auto;
width: 1000px;
}
/*
---------------------------------
LOGO / INFOS / HEADER / FOOTER...
---------------------------------
*/
#image_acceuil,#infos {
border: 1px rgb(60,60,60) solid;
}
/*
--------
1. LOGO
--------
*/
#image_acceuil {
background: black;
height: 512px;
border-bottom: 0;
}
/*
---------
1. INFOS
---------
*/
#infos {
border-collapse: collapse;
text-indent: 20px;
text-align: left;
width: 100%;
}
#infos_header {
background-color: rgb(50,50,50);
color: rgb(170,170,170);
font-size: 18px;
}
#infos_header th {
width: 50%;
}
#infos * td {
border-right: 1px rgb(60,60,60) solid;
font-size: 12px;
color: black;
}
.definitions {
background: rgb(88,87,82);
width: 15%;
}
.variables {
background: rgb(113,112,104);
font-weight: bold;
width: 35%;
}
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div id="main">
<div id="image_acceuil"></div>
<table id="infos" cellpadding="0" cellspacing="0">
<tr id="infos_header">
<th colspan="2">
<p>Informations Client</p>
</th>
<th colspan="2">
<p>Informations Serveur</p>
</th>
</tr>
<tr>
<td class="definitions">
<p>Adresse IP</p>
</td>
<td class="variables">
<p>192.178.1.28</p>
</td>
<td class="definitions">
<p>Adresse IP</p>
</td>
<td class="variables">
<p>255.255.255.255</p>
</td>
</tr>
<tr>
<td class="definitions">
<p>Nom d'hôte</p>
</td>
<td class="variables">
<p>192.178.1.28.adsl</p>
</td>
<td class="definitions">
<p>Nom d'hôte</p>
</td>
<td class="variables">
<p>www.noname.com</p>
</td>
</tr>
<tr>
<td class="definitions">
<p>Port source</p>
</td>
<td class="variables">
<p>1683</p>
</td>
<td class="definitions">
<p>Port</p>
</td>
<td class="variables">
<p>80</p>
</td>
</tr>
<tr>
<td class="definitions">
<p>O.S</p>
</td>
<td class="variables">
<p>Debian</p>
</td>
<td class="definitions">
<p>O.S</p>
</td>
<td class="variables">
<p>Fedora Core 4</p>
</td>
</tr>
</table>
</div>
</body>
</html>
Quelqu'un sait-il pourquoi ce comportement ?
Message édité par ANViL le 17-01-2006 à 22:16:34