28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Après des heures de recherches sur internet je crois que je vais jeter mon pc par la fenêtre! Je deviens fou! Peut-être est-ce tout bête mais cela dit, je ne parviens toujours pas à solutionner mon petit problème...

Je m'explique : J'ai une page dans laquelle je fais un include en php de mon menu et mon titre. Le reste de ma page contient un "div" qui est positionné en CSS et qui lui contient un tableau. Jusqu'ici ca va!

Maintenant mon tableau contient une ligne et deux cellules. La première avec du texte, la seconde une pitite photo... Rien d'exceptionnel me direz-vous!

Mais voici mon problème : je défini la largeur de mes cellules à 260 pixels et rien pour la hauteur. Comme mon texte à cette largeur fait plus ou moins 3-4 lignes, quelqu'un pourrait me dire pourquoi avec internet explorer ca marche nikel alors que Safari ou Modzilla ne m'affiche pas de retour à la ligne et me met un ascenseur horizontal assez vilain avec une cellule contenant le texte sur une seule ligne? JE n'utilise pas de balise pre ni de nowrap.

Je ne suis pas à mon premier site, mais 'est la première fois que j'ai un bug pareil! LA je suis perdu! Si quelqu'un à une idée je lui serait vraiment reconnaissant! J'ai essayé en donnat une id à ma cellule dans ma feuille de style et à mon tableau, avec les lasses égalment mais rien n'y fait!!!

Merci à vous.

Voici ma page :

<?
include_once "main.php";
?>
<div id="main">
<table width="500px" align="center">
<tr height="50">
<td colspan="2" align="center" height="50">
  <span class="style1"><u>Nos produits :</u><br /></span></td>
</tr>
<tr><td colspan="2" align="center"><br /><span class="style2">La soupe d'orties</span><br /></td>
</tr>
<tr>
  <td style="text-align:justify; margin-left:10; margin-right:10; margin-top:0; margin-bottom:0; width:260px;">
Notre soupe d'orties, cultivée en agriculture biologique, laissez vous tenter par ce d&eacute;lice qui vous fera d&eacute;couvrir un go&ucirc;t nouveau en plus du bien fait qu'elle procure au corps. </td>
  <td align="center"><img src="images/bocaux.jpg" />
</tr>
</table> 
</div>

<?
include_once "footer.php";
?>


Et voici ma feuille de style :
/* CSS Document */

body {background-color: #FFFFFF;}

img {border: 0px;}

a:link {color: #000000; text-decoration: none;}
a:visited {color: #000000; text-decoration: none;}
a:hover {color: #000000; text-decoration: none;}
a:active {color: #000000; text-decoration: none;}



#container {
 background-color: #FFFFFF;
 height: 600px;
 width: 900px;
 position: relative;
 top: 0px;
 left: 0px;
 margin: 0px;
 padding: 0px; 
}

#header {
 background-image: url(images/banner.gif);
 height: 100px;
 width: 900px;
 position: absolute;
 top: 0px;
 left: 0px;
 margin: 0px;
 padding: 0px; 
}


#main {
 border: 1px;
 border-color: #000000;
 border-style: solid;
 height: 490px;
 width: 710px;
 position: absolute;
 top: 110px;
 left: 190px;
 margin: 0px;
 padding: 0px;
 font-size: 12px;
 overflow:auto;
 overflow-x:hidden;
 clear:right;
 z-index:1;

}

Et voici le lien ou j'héberge actuellement ce bug : http://www.webkreatorz.be/tanguy/biorties/fr/produits.php

Encore merci pour votre aide! Smiley cligne
Modifié par tweetydep (03 Jan 2007 - 21:51)
Merci milles fois...

Je me doutais bien que ca devait être bétise... Souvent les réponses les plus évidentes se trouvent juste sous notre nez mais on ne parvient pas à les voir tellement on est obséder par le problème plus que par la solution elle même!

C'est vrai j'étais pas très loin de la réponses et je n'ai pas encore le réflexe de tester mes bugs sur W3C... Smiley cligne

Merci à toi pour l'info, j'espère pouvoir te rendre l'ascenseur (au sens figuré pas dans une page web Smiley lol )

A bientôt et merci encore!