28173 sujets

CSS et mise en forme, CSS3

Bonjour !

J'ai cherché partout dans les anciens posts et dans la FAQ, je n'ai pas trouvé la solution de mon problème.

J'ai créé un div "bas" (le dernier div de mon site) qui, pour je ne sais quelle raison, ne veut plus apparaître dès lors que l'écran (ou la fenêtre) est trop petit. Je m'en suis rendue compte en faisant un test de mon site en grande taille, sur un écran où cette div dépasse la taille de l'écran, et je n'ai pas trouvé de solution.
J'ai essayé de mettre "height: 100%" pour mon body, pour mon conteneur, sans résultat... J'ai essayé des tas d'autres choses mais rien n'a fonctionné.

Voici mon site et ma feuille de style ...

Merci d'avance de votre aide !!
Modifié par judithrou (27 Jun 2006 - 18:57)
judithrou a écrit :
J'ai créé un div "bas" (le dernier div de mon site) qui, pour je ne sais quelle raison, ne veut plus apparaître dès lors que l'écran (ou la fenêtre) est trop petit.

Avec quelle résolution, et quel navigateur ?

Je n'ai pas réussi à reproduire le bug avec Firefox.
<troll>mpop il faut un navigateur standard en matière de bug tu n'arrivera jamais à rien avec Firefox Smiley lol </troll>

Donc effectivement en 800/600 sous IE on perd la partie basse du site



Edit:

ça reponds pas à la question mais tu as une petite erreur déjà à ce
niveau

<div id="navig1"><p class="titre"><a href="index.html">ACCUEIL</a></p>
	</div>
	
	<div id="navig1"><p class="titre"><a href="menu.html">MENU</a></p>
	</div>


Tu utilise 2 fois la même id
Modifié par knarf (27 Jun 2006 - 20:27)
rebonjour judithrou,

En donnant une hauteur fixe à ton div conteneur cela doit pouvoir résoudre le problème.

(j'ai mis par exemple une hauteur de 800px pour tester)
Modifié par knarf (28 Jun 2006 - 00:19)
Merci pour vos réponses.

- mpop : J'avais oublié de préciser que le problème apparaissait seulement sur IE.

- knarf : J'ai fait exprès d'utiliser le même div, je pensais que c 'était possible ! Est-ce que je dois créer un autre div appelé "navig2" identique à "navig1", juste pour pouvoir mettre les deux côte à côte ? (Mais je suppose que je devrais plutôt utiliser une fonction du genre "float"... Je vais transformer ça).
-- Je viens de faire la modif en utilisant un ".floatnavig" au lieu d'un div "navig1", comme ça je peux le répéter. Mais comme ça marchait je ne pensais pas que ça n'était pas faisable !...

- knarf encore, je veux bien mettre une hauteur fixe à mon div conteneur, mais mon problème c'est que pour mon div "pied" je l'ai mis en em, histoire de permettre que si les gens agrandissent la police, le div suive... Les autres hauteurs étant en px, ça va m'obliger à mettre une hauteur qui corresponde au format pour la grande police, et du coup qui descende trop bas pour une police moyenne. Du coup les gens qui ont un petit écran pensent qu'il y a des choses plus bas, ils descendent et sont déçus parce qu'il n'y a que du vide... Smiley confus
J'ai opté pour cette solution (j'ai mis 640 px de hauteur), tu peux voir ce que ça donne sur le site.

Effectivement, ça me paraît quand même être une solution à mon problème... Merci beaucoup. Smiley jap

M'enfin si tu as une idée qui permette de respecter les em et les px en même temps (on ne sait jamais !!), je suis preneuse ! Smiley cligne
Modifié par judithrou (28 Jun 2006 - 11:34)
Bonjour judithrou,

Personnelement je ne suis pas un fan du positionnement absolu et relatif ce qui peut être une des sources de ton problème.

Aprés c'est peut être une volonté du commanditaire mais pourquoi vouloir absolument brider ce contenu en hauteur?

Je serai toi, j'essaierai si tu as la possibilité de reprendre complétement la structure de ta page et d'enlever tous ces positionnements.

Tu as en fait un background unique pour ton body qui contient la banniere et le petit sabot donc oui cela te force à respecter la hauteur de ce background.

Si maintenant tu le découpe en deux parties bien distinctes une image pour la banniere, une couleur de fond pour le body et l'image du sabot incluse dans ton pied de page cela te permet de voir les possibilités de structure et de positionnement différement.

* Un div global pour centrer le site (sans hauteur définie)
* Un div banniere ou header avec son image (avec une hauteur défini).
* Pour eventuellement éviter le float du menu qui peut être sources de problèmes passer par un display inline sur les li.
* Un bloc central (sans hauteur définie) contenant la partie gauche sans limitation de hauteur (le texte) la partie droite (les images)
* Le bas de page (hauteur définie) avec l'image du sabot et un clear both pour les eventuels flottants du contenant.

Tout cela sans préciser de positionnenemnt particulier à part le float de la partie contenu.