28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Je viens sur ce forum car je pense avoir tout étudier mais je ne vois pas la solution à mon problème.

Voici une page qui me pose problème :
http://www.openiscpa.com/resumes_des_journees.php3?date=2006-04-20

Sous IE, nickel mais sous Firefox, y cet espace qui pousse mon contenu vers le bas d'autant que mon menu à gauche s'allonge. Après étude, çà viendrait d'un clear left ou both que je met entre chaque résumé qui est contitué d'un UL nourri de trois LI.

Si je met clear:right, sous IE çà roule aussi mais cette fois sous firefox, mon contenu remonte bien mais si je mets pas de résumé, juste le titre du match, le résumé du dessous vient prendre la place vide et remonte vers l'image précédente comme elle était en align left. J'ai été clair ? j'espère ?#! Smiley confus Voici le lien vers une image du problème

Ma feuille de style est dispo en lien en bas sinon vous pouvez enregistrer la page chez vous si vous voulez faire des tests..

Merci d'avance !!!
Modifié par CaptainD (26 Apr 2006 - 01:02)
Alors bon je sais pas si je vais pouvoir beaucoup t'aider, mais je pense que pour ceux qui savent un bout de code parle mieux que des images. le code CSS par exemple. ça vient peut-être de là.

En revanche jevois bien le probleme que tu as, mais je vois pas très bien comment tu veux placer tes images au final.

David.
Modifié par Davee (26 Apr 2006 - 00:09)
Ben en fait le premier lien, c'est à çà que çà dois ressembler et çà marche sous IE.

L'image, c'est ce que j'obtiens sous firefox !

J'ai pas mis de code car je sais pas vraiment qu'elle partie de ma css plante. Je sais que çà vient des float et surtout (apparemment des clear). C'est pourquoi j'avais dit que les personnes qui voudrait bien m'aider pourrait la téléharger depuis le site sinon cliquez-ici et pour la page (le mieux étant de l'enregistrer depuis son navigateur) donne en resumé

<div id="droite">
    <p class=...
    <p class=...
</div>
<div id="gauche">
    <ul class="team">
       <li class='fot_o'></li>
       <li class='texte'>
           <p ........
          <p.............
       </li>
     </ul>
</div>


Sur cette page (premier lien de mon premier post) j'ai mis deux div l'un à cote de l'autre. Le premier en float left et l'autre avec margin-left et un height à 1% pour éviter le three jog pixel de IE.

Dans le div de droite, la mise en page avec l'image, je l'ai faite avec un ul et deux li en float aussi pour qu'il s'aligne et surtout que qu'ils adaptent leur hauteur en fonction du contenu (site dynamique) et ce que les li ne font pas avec le display inline et position abs ou rel.

Comme mes li sont en float à droite, je met un clear. Mais si (comble) tout va bien sous IE... firefox ne pose souci si mon clear est à left on obtient ceci et si je le met à right, j'ai cela. Sachant que le résultat à obtenir est ici

Voila en espérant avoir été plus clair et merci d'avance car je dois bien avouez que je sèche!
Problème résolu ........... merci pour ceux qui ont pris le temps de lire et d'essayer de me répondre.

PS: la solution consistait à jouer sur float left d'un coté et float right de l'autre.........