Salut tout le monde,
Après avoir longuement bidouillé, et apres quelques recherches sur google et les fofo de alsacreation, j'ai toujours un énorme probleme... J'espere que quelqu'un aura la solution, car à chaque fois que j'ai demandé votre aide, j'ai loin de la regretter xD
Donc la, on essaie de faire le portfolio d'un ami à moi, et on pinaille depuis longtemps sur la taille d'une case td du tableau...
voila ce que ca fait : http://shinois.free.fr/flo/portfolio.html
j'ai mis en couleur (bleu et rouge) les 3 problemes que l'on a :
- les tailles que l'on a mis sur le CSS ne sont pas respectés.
- ce sont ces cases qui s'agrandisent au lien des motif gauche et droite en repeat-y.
voila le code html :
et le CSS :
J'ai pensé que le probleme venait des colspan, rowspan, mais j'ai bien vérifié, j'ai meme enlevé un rawspan="2" pour mettre un td en plus sur la droite mais ca veut vraiment pas...
le probleme vient des cases TD qui ont une taille, mais qui s'agrandissent en fonction du contenu...
exemple : le coin gauche (id="coin-gauche") a une taille bien défini, une image en fond, et un background rouge, qui normalement n'est pas affiché :
http://shinois.free.fr/flo/images/interface/essai-interface_06.jpg
La case dépasse largement l'image et fait apparaitre le rouge...
Je vais encore chercher, en attendant, j'espere, une réponse qui nous sauvera xD
Encore merci à vous, et bonne journée
A+++
Léo
Modifié par leomac (10 Nov 2007 - 18:31)
Après avoir longuement bidouillé, et apres quelques recherches sur google et les fofo de alsacreation, j'ai toujours un énorme probleme... J'espere que quelqu'un aura la solution, car à chaque fois que j'ai demandé votre aide, j'ai loin de la regretter xD
Donc la, on essaie de faire le portfolio d'un ami à moi, et on pinaille depuis longtemps sur la taille d'une case td du tableau...
voila ce que ca fait : http://shinois.free.fr/flo/portfolio.html
j'ai mis en couleur (bleu et rouge) les 3 problemes que l'on a :
- les tailles que l'on a mis sur le CSS ne sont pas respectés.
- ce sont ces cases qui s'agrandisent au lien des motif gauche et droite en repeat-y.
voila le code html :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Portfolio-THIERS Florian</title>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
</head>
<body>
<div id="global">
<div id="header">
<table>
<tr>
<td colspan="3" width="900px" height="26px"><img src="images/interface/header_01.jpg" /></td>
</tr>
<tr>
<td width="46px" height="133px"><img src="images/interface/header_02.jpg"/></td>
<td width="125px" height="133px"><img src="images/interface/header_03.jpg"/></td>
<td rowspan="2" width="729px" height="196px"><img src="images/interface/header_04.jpg"/></td>
</tr>
<tr>
<td colspan="2" width="171px" height="63px"><img src="images/interface/header_05.jpg"/></td>
</tr>
</table>
</div>
<div id="container">
<table>
<tr>
<td id="coin-haut"></td>
<td id="corps" rowspan="3">
<p>
hqscjdsfnqkjdsbgsdkjghnsldkgklsdng bnkldfnsbv rgsdge eqrg ergrg esg ezsgezg erg erg erg qerzs
hqscjdsfnqkjdsbgsdkjghnsldkgklsdng bnkldfnsbv rgsdge eqrg ergrg esg ezsgezg erg erg erg qerzs
hqscjdsfnqkjdsbgsdkjghnsldkgklsdng bnkldfnsbv rgsdge eqrg ergrg esg ezsgezg erg erg erg qerzs [.......]
</p>
</td>
<td id="droite"></td>
</tr>
<tr>
<td id="motif-gauche"></td>
<td id="motif-droite"></td>
</tr>
<tr>
<td id="coin-gauche"></td>
<td id="coin-droit"></td>
</tr>
</table>
</div>
</div>
</body>
</html>
et le CSS :
*{
margin: 0;
padding: 0;
}
body{
background-color: black;
}
#global{
width: 900px;
margin: 0 auto;
}
table{
border-collapse: collapse;
border:none;
}
td#droite{
width:31px;
height: 213px;
background:url("../images/interface/motif-droite.jpg") repeat-y;
}
td#motif-droite{
width:31px;
background:url("../images/interface/motif-droite.jpg") repeat-y;
}
td#motif-gauche{
width: 194px;
height: 200px;
background:url("../images/interface/motif-gauche.jpg") repeat-y;
}
#corps{
width:675px;
height:100%;
background-color:#F5F5F5;
background-image: url("../images/interface/corps-fond.jpg");
background-repeat: no-repeat;
background-position:bottom;
vertical-align:top;
}
td#coin-haut{
width:194px;
height:213px;
background:url("../images/interface/essai-interface_02.jpg") no-repeat blue;
}
td#coin-droit{
width:31px;
height:304px;
background:url("../images/interface/coin-droit.jpg") no-repeat red;
}
td#coin-gauche{
width:194px;
height:304px;
background:url("../images/interface/essai-interface_06.jpg") no-repeat red;
}
J'ai pensé que le probleme venait des colspan, rowspan, mais j'ai bien vérifié, j'ai meme enlevé un rawspan="2" pour mettre un td en plus sur la droite mais ca veut vraiment pas...
le probleme vient des cases TD qui ont une taille, mais qui s'agrandissent en fonction du contenu...
exemple : le coin gauche (id="coin-gauche") a une taille bien défini, une image en fond, et un background rouge, qui normalement n'est pas affiché :
http://shinois.free.fr/flo/images/interface/essai-interface_06.jpg
La case dépasse largement l'image et fait apparaitre le rouge...
Je vais encore chercher, en attendant, j'espere, une réponse qui nous sauvera xD
Encore merci à vous, et bonne journée
A+++
Léo
Modifié par leomac (10 Nov 2007 - 18:31)