Page 1 sur 1

Bug Alsacréations

Publié : 12 juin 2006, 16:00
par guilhem_mdg
Bonjour,
Je me retrouve confronté à un problème:
Alsacréations propose la mise en page suivante:
http://css.alsacreations.com/modeles/modele3.htm
Mais si la partie centrale contient beaucoup moins de lignes que le menu alors le menu dépasse...
Et c'est pas bon!
Comment corriger?
Merci.

Publié : 13 juin 2006, 16:03
par guilhem_mdg
Personne ne trouve ? :cry:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 13 juin 2006, 17:05
par Asumbaa
Hello,

Il y a plusieurs solutions, tout dépend de ce que tu veux faire.
Je crois qu'il y a un autre modèle Alsacreations où les deux "colonnes" évoluent ensemble.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 14 juin 2006, 09:05
par guilhem_mdg
Bah, qu'est-ce que tu ne comprends pas dans mon explication ?

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 14 juin 2006, 10:59
par Asumbaa
Hello,

Je comprends ce que tu dis, mais je ne sais pas ce que tu as. Par exemple, est-ce que toutes tes pages seront plus courtes que ton menu ? Quel résultat veux-tu quand le contenu est très court ?

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 14 juin 2006, 12:14
par guilhem_mdg
Oui c'est bien ça en fait, si mon menu est plus grand que le corps de page alors le menu dépasse et du coup le pied de page ne s'affiche pas en dessous du menu mais en dessous du corps de page...

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 14 juin 2006, 13:37
par epsy
salut,
Asumbaa a écrit :Par exemple, est-ce que toutes tes pages seront plus courtes que ton menu ?
Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 14 juin 2006, 14:10
par Asumbaa
Faisons des suppositions, puisque tu ne sembles pas voiloir donner de précisions :wink:

CAS 1 : toutes tes pages ont peu de contenu et/ou ton menu est super-grand donc le souci du menu est partout
RESOLUTION 1 : positionner non pas le menu mais le contenu en absolu

Code : Tout sélectionner

#centre {
position: absolute;
left: 150px;
top: 100px;
background-color:#9999CC;
}
#gauche {
width: 150px;
}
CAS 2 : tu as des pages avec plein de contenu, d'autres avec peu de contenu. Tu veux que dans tous les cas le footer soit à sa place en dessous de tout le monde.
RESOLUTION 2 : tu as le choix entre oublier la position absolue et utiliser les flottants, ou bien organiser ta page autrement pour inclure ton menu et ton contenu dans une boîte englobant #centre (mais c'est moins propre sémantiquement)

Code : Tout sélectionner

#centre {
background-color:#9999CC;
margin-left: 150px;
}
#gauche {
float: left;
width: 150px;
}
#pied {
clear: left;
height: 30px;
background-color: #99CC99;
}
ou

Code : Tout sélectionner

#corps {
position: relative;
width: 750px;
padding-right: 600px;
}
#centre {
position: absolute;
left: 150px;
top: 0;
background-color:#9999CC;
}

<div id="corps">
  <p>menu</p>
  <p>largeur fixe : 150px</p>
  <ul class="menugauche">
	<li><a href="">Menu 1</a></li>
	<li><a href="">Menu 2</a></li>
	<li><a href="">Menu 3</a></li>
	<li><a href="">Menu 4</a></li>
  </ul>
  <div id="centre">partie centrale qui "pousse" les colonnes vers le bas.<br />
partie avec du contenu occupant le reste de la largeur<br />
partie avec du contenu occupant le reste de la largeur<br />
partie avec du contenu occupant le reste de la largeur<br />
partie avec du contenu occupant le reste de la largeur<br />
partie avec du contenu occupant le reste de la largeur<br />
  </div>
</div>
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 15 juin 2006, 08:58
par guilhem_mdg
Faisons des suppositions, puisque tu ne sembles pas voiloir donner de précisions
Si si... bien sûr!
En fait, tu vas sur le lien que je t'ai donné plus haut, tu enregistres la pages sur ton disque et tu supprimes toutes les lignes du corps de page (partie centrale). Tu testes et tu regardes le menu...
C'est pas compliqué ? :wink:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 15 juin 2006, 09:03
par HP
guilhem_mdg a écrit :En fait, tu vas sur le lien que je t'ai donné plus haut, tu enregistres la pages sur ton disque et tu supprimes toutes les lignes du corps de page (partie centrale). Tu testes et tu regardes le menu...
C'est pas compliqué ? :wink:
et ce serait pas plus simple que tu mettes en ligne une page avec peu de contenu ?
parce que avec Firefox on peut éditer le CSS en ligne, c'est bien plus simple que la manip que tu proposes ...

Publié : 15 juin 2006, 10:19
par Asumbaa
guilhem_mdg a écrit :En fait, tu vas sur le lien que je t'ai donné plus haut, tu enregistres la pages sur ton disque et tu supprimes toutes les lignes du corps de page (partie centrale). Tu testes et tu regardes le menu...
C'est pas compliqué ? :wink:
:shock: Ben non, c'est pas compliqué, c'est bien ce que j'ai fait d'ailleurs. J'ai très bien compris le souci que tu décris, là n'est pas le problème ! Ce qui me manquait, c'était des infos sur ce que tu voulais faire...

Bref, dans mes solutions 1, 2 et 3 y'en a pas une qui te convient ?

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 15 juin 2006, 11:00
par guilhem_mdg
Asumbaa, Merci de ta patience...
Je suis en train de tester tes solutions mais la difficulté vient du fait que mon menu est dynamique et sa hauteur n'est pas fixe.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 15 juin 2006, 14:28
par guilhem_mdg
Asumba, je viens de tester:
Le problème est que mon menu doit absolument etre en absolute car j'ai dans la partie droite une liste d'images les uns à la suite des autres grâce à des float:left. Chaque retour à la ligne de ces images se fait par un clear:both.
Je ne peux donc pas mettre de menu: float:left car sinon ma 2ème ligne d'images va se mettre tout en dessous du menu...
Bref, je ne vois pas de solution...

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 15 juin 2006, 15:40
par Asumbaa
guilhem_mdg a écrit :Asumba, je viens de tester:
Le problème est que mon menu doit absolument etre en absolute car j'ai dans la partie droite une liste d'images les uns à la suite des autres grâce à des float:left. Chaque retour à la ligne de ces images se fait par un clear:both.
Je ne peux donc pas mettre de menu: float:left car sinon ma 2ème ligne d'images va se mettre tout en dessous du menu...
Bref, je ne vois pas de solution...
D'accord, ça c'est sûr ça te limite le truc.
Tu peux faire flotter tes images à droite et faire un clear:right pour tes lignes (mais je crois bien que les navigateurs ont beaucoup de mal avec ça).

Ou bien tu utilises ma solution 3 :roll:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4

Publié : 15 juin 2006, 16:23
par guilhem_mdg
Ok bon en fait, j'ai résolu le truc. Enfin... Disons que j'ai supprimé le nombre d'images par ligne et donc les clear:both. Ce qui fait que j'ai pu mettrre sur le menu un float:left et juste après le corps de droite j'ai mis un clear:both...
C'est pas résolu mais j'ai trouvé une solution alternative.
Merci à tous! 8-)

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4