[css] repeat et decalage

Dernière pitite mise en page pour finir le site.

Les sources sont dispos sur www.outremondes.com/dvlp et le css est ici:
http://www.outremondes.com/dvlp/include/OMfixe.css

mes 2 derniers problèmes sont les suivants et j'ai bien essayer tout le w-e pour y arriver:

* dans le menu de gauche, j'aimerais que le texte soit décala vers la gauche pour tenir complétement dans le parchemin. comme vous pourrez le voir le texte déborde un peu.

*entre le menu et le parchemin, ya un "totem". J'ai été obligé de fixer sa taille avec width et heigth sinon il n'apparait pas. Et le problème est aussi que sa taille n'évolue pas en fonction de la taille du parchemin.

Voili voilou

pour le menu de gauche, tu peux essayer d'utiliser le CSS 'padding: top right bottom left' (mets par ex. 'padding: 1px 15px 1px 3px', ça fera une marge intérieure de 1 en haut et en bas, et de 15 à droite (et 3 à gauche); si ton texte est calé sur l'image, elle occupera tout le fond, tandis que le texte sera contraint de laisser une marge supplémentaire à droite, et ne devrait plus dépasser.

Bon, une image qui s'adapte, elle peut beaucoup changer de forme... mais pour faire ça, essaie d'utiliser height:100% (ou moins...), mais en pourcentage, sinon ça reste de la même taille, normal !

en tous cas, c'est le genre de site qui plairait à mes colocs (y'en a qu'aiment jouer à des jeux, d'autres à les créer...) !

Bon courage pour la suite !

C'était bien vu pour les padding: 0px 22px 1px 18px; malheureusement cette cochonerie de Intermerde explorer déconne et décalle tout les cadres.
Ya pas un moyen de le faire réagir correctement ? Je crois que c'est le problème des box microsoft et des box standart mais je ne trouve pas comment corriger ça.

sinon pour le height 100% ça fait disparaitre le totem qu'importe la taille de la page. Je ne trouve pas non plus de solution pour ça...

essaye d'ajouter au début du CSS les propriétés

Code:

---

1 2 3 4 5 6

html { margin:0; padding:0; border:0; }

---

si ton totem n'apparaît pas, tu peux jouer avec les 'couches' (comme ds photoshop), la troisième dimension :
z-index: 10; (par ex., pour la page de base)
z-index: 100; (par ex., pour le totem)
tu trouveras de la doc dessus facilement si tu connaissais pas cette propriété...
en gros, le totem passera 'devant', par-dessus la feuille de base.
Mais IE pose toujours des pbs avec les position: fixed (si tu en utilises)

Rien n'y fait, malgré tes indications et mes centaines d'essaie je ne parviens pas à:
- décaler légèrement mon menu sans perde la mise en page aussi bien sour IE que FF

- faire apparaitre ce %$^µµ^$ de totem en fonction de la taille du parchemin

je ne sais plus trop quoi te dire...

pour la mise en page,
- soit tu essaies d'avoir un site qui s'adapte à toutes les résolutions, et ça va pas être évident parceque il faut que tout soit en %, étirer les images, etc... or beaucoup d'éléments sont quand même définis en pixels (px)

- soit tu définis une résolution optimale et tu fais ton site pour cette résolution (1024*768 par ex.), dans ce cas tu peux tout 'fixer'

- soit pour les éléments qui posent pb, tu les incruste carrément dans l'image et tu fais une "image map"; c'est peut-être le mieux - en tout cas, ça ne bougera plus et l'affichage sera partout le même (sauf détails minimes...)

Bon à mon avis ça restera comme ça sauf si qqun découvre un jour une solution.

En tout cas ton astuce des images réactives va me servir pour autre chose ;-)