Questions CSS

[Sylvanor]

Salut à tous, c'est mon premier topic ici, je viens poster après plusieurs heures de recherche à tout essayer et à demander à des potes, sans jamais parvenir à obtenir des explications claires ni surtout des solutions à mes problèmes, alors je m'en remets à vous.

Voilà, j'essaie en ce moment de transformer l'un de mes sites, construit sous forme de tableaux, pour le passer aux Divs.

Voici à quoi ressemble la version tableaux: version originale

Et voilà où j'en suis rendu avec mes divs: ça craint.

Comme vous pouvez le voir, il y a pas mal de bugs plutôt moches. Je voudrais donc savoir si vous pouviez m'aider en me guidant un peu et en m'expliquant...

- pourquoi j'ai un espace avant le div de la bannière du bas, comment l'enlever? J'ai essayé un display: inline mais ça enlève l'image de fond, et le padding ne change rien.

- pourquoi le texte à l'intérieur de ce div n'est pas centré verticalement malgré le vertical-align: middle?

- comment je peux faire pour allonger automatiquement mes divs latéraux jusqu'en bas (pour qu'ils touchent tous le div du bas), comme sur ma version tableaux?

Je sais que certains penseront que si je passe aux Divs, ce n'est pas pour refaire la même chose qu'en tableaux, et qu'élargir ces divs pour simuler un affichage tableau n'est pas la meilleure idée esthétiquement parlant, mais moi c'est le rendu que j'aime et je voudrais réussir à le retranscrire en CSS, à la fois par goût et aussi par défi parce que j'entends depuis longtemps qu'on peut refaire exactement en divs tout ce qui était faisable en CSS, et que comme j'ai été longtemps réticent à l'emploi des divs, je voudrais avoir la preuve que c'est vrai en y parvenant.

Voilà, merci à ceux qui me liront, et encore plus à ceux qui m'aideront.

Ca fait une semaine que ce machin traîne sans que j'arrive à le régler...

[ghost]

Bonsoir,

C'est plutot pas mal déjà, comme tu as l'air d'aimer mettre les mains dans le cambouil, peut être tu connais déjà tutoriel alsacreations.

Bon courage

[zimounet]

Salut,

Pour le foirage du bas, il faut implémenter la div du footer dans la div du contenu, et appliquer à la div du footer l'attribut:

clear:both;

Avec cette méthode, tu pourra "pousser" l'apparence des div jusqu'en bas.

Si cela ne suffit pas et que tu as encore des divs à pousser, alors essaye d'en créer des "vides", avec l'attribut clear ayant une valeur both, comme ci dessus, et de l'appliquer comme ceci (vide):

<div id="clearboth"></div>

Comme tel sans rien a l'intérieur...

J'espere que tu t'en sortira, en tout cas chapeau, c'est du beau boulot!

[Sylvanor]

Merci pour vos réponses!

J'ai essayé les divs vides avec des clear: both, mais ça ne semble rien changer...

Le div du pied-de-page est déjà inséré dans le div conteneur, donc le problème ne vient pas de ce côté je pense... :/

J'ai déjà parcouru les tutos dAlsacreation oui, mais ça n'a pas résolu mes problèmes.

A force de modifier le code j'ai réussi à faire disparaître l'espace avant le div du bas, mais le texte à l'intérieur ne veut toujours pas se centrer et lorsque le div central est plus long que le div de droite, l'espace revient (exemple ici).

Je suis bien embêté....

Note: j'ai vu que le topic avait été déplacé, mes excuses donc aux modérateurs pour avoir posté au mauvais endroit.

Modifié 10 Mai 2006 par Sylvanor

[jeanpierre949]

tu n'as qu'une solution dansces cas la mettre 2 blocs avant tous les autres avec les proprietes suivantes

 #gauche {
width: auto;
height: auto:
background: url(imageG.ext) repeat-y left top;
}
 #droite {
width: auto;
height: auto:
background: url(imageD.ext) repeat-y right top;
}

les images a placer sont des images qui vont imiter tes menus droite et gauche et ces 2 blocs tu les fermes apres tous les autres.

exemple ici exemple

sans cette methode le menu s'arretterait apres le dernier item alors qu'on a l'impression qu'il va jusqu'au footer

Modifié 10 Mai 2006 par jeanpierre949

[Sylvanor]

Excellent, ça fonctionne, merci beaucoup!

Il faudra que je mémorise cette astuce avec les auto, c'est vraiment pratique.

J'ai aussi réussi à résoudre les autres problèmes (avec la cellule du bas), mais par contre je viens de me rendre compte qu'il y a un énorme bug sous IE: troisième version. Après le table en haut de la cellule centrale, tout le contenu de la cellule centrale est reporté en bas de page, après que le div de droite soit terminé. J'ai longuement cherché mais une fois de plus en vain. Si quelqu'un pouvait me filer un dernier coup de main, ça serait très sympa.