div: hauteur auto ?
Le
alainL
Bonsoir,
J'essaie de créer,
dans un div "contenu" (limité aux 80% a droite de la page,
un autre div "annee", encadré, dans lequel je pourrais écrire sur toute
la largeur et/ou placer trois listes à puces dans trois colonnes
(gauche, milieu etreste).
Ça prend forme doucement mais je ne parviens pas à régler la hauteur
du div "annee" pour qu'il ne coupe pas les listes !
Merci pour le coup de main !
#contenu {
height: 100%;
margin-left: 20%;
overflow: auto;
color: #000000;
}
#annee{
position:relative;
width:90%;
height:auto;
border: 2px solid black;
padding : 5px;
}
#gauche {
position:relative;
float:left;
width:30%;
}
#milieu {
position:relative;
float:left;
width:30%;
}
--
AlainL
http://autourdalos.fr
J'essaie de créer,
dans un div "contenu" (limité aux 80% a droite de la page,
un autre div "annee", encadré, dans lequel je pourrais écrire sur toute
la largeur et/ou placer trois listes à puces dans trois colonnes
(gauche, milieu etreste).
Ça prend forme doucement mais je ne parviens pas à régler la hauteur
du div "annee" pour qu'il ne coupe pas les listes !
Merci pour le coup de main !
#contenu {
height: 100%;
margin-left: 20%;
overflow: auto;
color: #000000;
}
#annee{
position:relative;
width:90%;
height:auto;
border: 2px solid black;
padding : 5px;
}
#gauche {
position:relative;
float:left;
width:30%;
}
#milieu {
position:relative;
float:left;
width:30%;
}
--
AlainL
http://autourdalos.fr
la colonne de droite va se mettre à droite mais aussi glisser sous les 2
autres
pas besoin de la position
pas besoin de la position
.final { clear: left;
height:1px;margin:0;padding:0;border:none }
<div id="contenu>
<div id="annee">
<div id="gauche">
<ul><li>à gauche,<li>gauche!<li>mauvaise<li>troupe</ul>
</div>
<div id="milieu">
la perle dans l'écrin
</div>
<div>colonne droite<br>ou<br>le contenu sans colonne</div>
<div class="final"></div>
</div>
<p> du blabla pour voir</p>
</div>
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Merci Sam. J'ai réutilisé tout ça sur une page du site et testé sur IE8,
sur Ffx et Chrome. Impeccable... enfin, pour la partie que tu as
corrigée. (J'aurai encore de l'occupation si je veux virer tous les
<table> inutiles !)
http://alos-sibas-abense.com/bulletins1.php
J'ai un petit souci avec "<li>", souci qui n'apparaît pas avec IE (pour
une fois !) mais visible avec Chrome et Ffx:
dans le dernier div de la page (année2014), le contenu de la colonne de
droite est décalé vers le haut. J'ai voulu mettre un <br> mais il décale
trop. Une <li> vide en bas pour voir n'est pas beau et ne corrige rien.
Bonne journée
alain
--
AlainL
http://autourdalos.fr
(snip des correctifs)
#milieu ul,
#gauche ul { margin: 0; }
par exepmple
Attention !
quand on étroitise ça cafouille avec le div de droite !
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Le margin 0 ne change rien. Je croyais m'en sortir avec un margin-top
27px à la colonne de droite. C'est sans doute un peu bancale mais ça
semble marcher sur Ffx et Chrome ...MAIS PLUS SOUS IE8 !!!
J'ai réduit la largeur de"annee" et centré... faudra pas étroitisé plus !
Maintenant, c'est Monsieur Validator qui me reproche les multiples
utilisations du div annee. Je le trouve bien susceptible ce type :-))
--
AlainL
http://autourdalos.fr
il faut placer le correctif *à la place* de l'ancien ou *après* !
???
Je re-regarde
Non, c'est très TRÈS bancal !!
si on bricole pour que ça marche c'est qu'on est sur la mauvaise voie
Revoir plus haut ou autrement.
Il ne peut il y avoir qu'UN *et un seul* div de même nom dans un fichier
web !!!
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Bon, j'ai ajouté #gauche ul,#milieu ul {margin : 0} C'était OK pour
l'alignement mais IE me bouffait les puces dans ces deux colonnes. En
corrigeant avec margin-top tout va bien...........
Je me demande si je ne vais pas vexer le monsieur en question et garder
mes div. Quel est le risque ???
Sinon, que me conseillerais-tu ?
Cordialement
--
AlainL
http://autourdalos.fr
Changez l'id en class. C'est fait pour ça.
--
Pierre Maurette
même en "class" ?
Cordialement,
--
docanski
Portail et annuaire du nord-Bretagne : http://armorance.free.fr/
Guide des champignons d'Europe : http://mycorance.free.fr/
La vallée de la Rance maritime : http://valderance.free.fr/
Les côtes du nord de la Bretagne : http://docarmor.free.fr/
Heu !!!!!
Je voulais dire de même "ID" !!!!
Il ne peut il y avoir qu'UN *et un seul* div de même ID dans un fichier
V'là que je m'icromouds tout seul !!!!!
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Ça marche ! Et Monsieur Validator qui met les notes a trouvé le code
correct :-))
Merci à tous.
Sam, repose-toi, je ne t'embêterai plus ... ce soir !
Cordialement
--
AlainL
http://basaburua.fr