Problème affichage Fermé

Question

Bonjour,

J'ai un problème d'affichage sur mon site.

Pour que vous puissiez comprendre allez à l'adresse:  http://www.izimo.eu

Cliquez ensuite dans le menu à gauche "Les Devises".

Lorsque vous cliquez sur "Les Devises" le site se décalle vers le bas.. J'ai l'impression que c'est parce qu'il y a trop de texte dans le contenu (Faites des allez-retour entre "Introduction" et "Les Devises" pour bien voir le problème).

Est-ce qu'il existe un moyen de figer le site quel que soit la taille du contenu de la page consultée? de manière à ce que le design reste toujour fixe et qu'il ne se décalle pas vers le bas.

PS: J'ai essayé un "vertical align: top;" mais ca marche pas..

Merci par avance pour votre aide.

A bientot.

Louis

Utilisateur anonyme · Answer

Oui c'est parce que c'est trop grand ! Je te propose de mettre comme propriétés CSS au contenu celles-ci :
height:lapauteurenpx;
overflow:auto
Quand le contenu sera trop grand, il y aura un ascenseur, mais que sur le contenu !

louis1984 · Answer

Merci rd_9

Mais comment faire si mon site est paramétré en % et non en pixels?

Est ce que je peux mettre:

height:lapauteuren%;
overflow:auto



?

Utilisateur anonyme · Answer

Tout à fait ! Perso, je préfère les pixel mais tu peux biensur mettre height:75%; Mais ce seront les 75% de la taille du parent, c'est à dire le bloc dans lequel le contenu est.

louis1984 · Answer

Autre problème je viens d'essayer avec la propriété overflow mais j'ai désormais une barre de défilement à droite... et je trouve ça pas très joli...

Voici un lien direct: http://www.izimo.eu

Y-a-t il une autre solution un peu plus esthétique? c'est à dire sans cette barre de défilement verticale?

Merci par avance pour votre aide.

Utilisateur anonyme · Answer

Euh... Oui c'est vrai... Mais moi, ca marche, et toc ;-P
Tu peux remettre comme avant stp ?

louis1984 · Answer

grrr... j'ai tout le temps des problèmes...! lol

Ca y est j'ai remis comme avant.

Utilisateur anonyme · Answer

Je me suis permit d'enregistrer ta page sur mon disque pour faire des tests (Tu ne m'en veux pas hein ?).
Et j'ai trouver (je l'espère) la solution : Il faut enlever le "HEIGHT: 100%;" au 144ème caractère de la 11ème ligne de ton fichier "index.css" et il n'y a plus d'espacement =D !
Vérifie quand même si ça n'occasionne pas d'autres bug de présentations !

PS: Pour ce qui est de ton site en général, il y a quelques problèmes qui n'ont rien à voir avec ce problème : Le logo est inexistant (image manquante), On peut lire en bas "Tous droits rÃ©servÃ©s" (Vous pouvez répétez ?) et puis, le plus gros pour la fin, ça ne mareche qu'avec IE ! Avec Google Chrome, Firefox ou safari, le menu horizontale est au dessus du titre du contenu et du logo inexistant qui est lui même sur le menu vertical !! tu ferai mieux pour toi de revoir ces quelques problèmes. Bon courrage ;-)

louis1984 · Answer

Je n'arrive pas à savoir quel height: 100% supprimer car je n'en ai pas à la ligne 11 ..

Pourrais tu me dire lequel je dois supprimer? Voici mon CSS:


@charset "utf-8";
/* CSS Document */

body {
	margin: 0%;
	padding: 0%;
	background-color: #CCC;
	text-align: center;
	vertical-align: top;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;
	}
body, table {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;

	}
div#cadre {
	text-align: left;
	width:100%;
	height:100%;
	background-color:#FFF;
	margin-left: 10%;
	margin-right: 10%;
	margin-top: auto;
	margin-bottom: auto;
	border:#000000;
	border-width: 1;
	border-style: solid;
	}
div#logo {
	width:100%;
	height:10%;
	background-color:#FFF;	
	}
div#menu {
	text-align: left;
	width:100%;
	height:3%;
	background-color:#FFF;	
	}
div#colonne_gauche {
	margin-left: 2;
	float:left;
	width:13%;
	height:82%;
	background-color:#FFF;
	border-width: 1;
	border-style: solid;
	
	}
div#contenu {
	margin-left: 2;
	float:left;
	width:86%;
	height:82%;
	background-color:#FFF;
	border-width: 1;
	border-style: solid;

	}
div#piedpage {
	width:100%;
	height:5%;
	background-color:#6CF;
	clear:both;
	vertical-align: bottom;



Pour ce qui est des autres problèmes je regarderai plus tard ;) Je sais qu'il y a bcp de problèmes c'est mon premier site. 

Merci pour ton aide.

Louis

louis1984 · Answer

Personne peut m'aider?

En supprimant le HEIGHT: 100% tout marche bien, mais le problème est que si j'enlève ce HEIGHT:100%, la hauteur du site dépend alors du contenu, plus il y a de texte, plus le site est grand en hauteur.. j'aimerais que le site ait une hauteur fixe quel que soit le contenu, et que lorsque le contenu est trop important, le site s'agrandisse en hauteur.. Je sais pas si c'est clair..

Merci

Utilisateur anonyme · Answer

C'est comme ça normalement qu'un site fonctionne. Pour éviter d'avoir du blanc inutile à la fin, il s'adapte au contenu. J'ai l'impression que tu demande quelque chose de paradoxale : "une hauteur fixe quel que soit le contenu" et "le site s'agrandisse en hauteur". 
Si tu veux qu'il y ai un hauteur minimale, et qu'elle puisse grandir si le contenu dépasse (est-ce bien cela ?), remplace le height 100% de ton fichier css pas la propriété min-height (https://www.zonecss.fr/proprietes-css/min-height-css.html

louis1984 · Answer

Merci rd_9 c'est exactement ce que je rechercher car sur mon site il y a des pages avec très peu de contenu, et je trouve pas très esthétique de voir le pied de page.. au milieu de la page!

PS: pourrais-tu jeter un coup d'oeuil à mon autre problème à l'adresse ci-dessous car tu à l'air d'être calé en webmastering (ce qui n'est pas le cas pour moi!):  

https://forums.commentcamarche.net/forum/affich-15775834-probleme-reduction-fenetre#2


Merci bcp pour ton aide.

Problème affichage

11 réponses

Discussions similaires