Problème de DIV lors de la réduction

Signaler
Messages postés
4
Date d'inscription
samedi 9 juillet 2005
Statut
Membre
Dernière intervention
20 janvier 2007
-
Messages postés
131
Date d'inscription
mardi 21 septembre 2004
Statut
Membre
Dernière intervention
23 septembre 2011
-
Bonjour,



J’essaye d’utiliser des
feuilles de style pour mettre en page un site.



Quand je mets des pixels
pour la mise en page ça fonctionne presque bien car j’ai quelque problème en
fonction du navigateur que j’utilise mais dans l’ensemble ça va.




<!--[if !supportEmptyParas]--> <!--[endif]-->





Mais je souhaiterai
plutôt utiliser des % que des pixels cela fonctionne si je laisse mon site
statique mais je souhaiterai que la mise en page s’agrandisse en fonction de
l’écran et de la résolution de l’utilisateur, cela fonctionne aussi. Mais j’ai
un problème lors de la réduction du navigateur car les différents DIV de la
page se chevauchent ainsi que le contenu donc il faudrait que dés une certaine
limite de réduction le site ne se réduise plus et que des ascenseurs
apparaissent en bas du navigateur mais je ne parviens pas a le faire.




<!--[if !supportEmptyParas]--> <!--[endif]-->





Merci pour votre aide.

5 réponses

Messages postés
131
Date d'inscription
mardi 21 septembre 2004
Statut
Membre
Dernière intervention
23 septembre 2011

Bjr,
Sous Firefox tu peux utiliser les propriétés min-width et max-width
IE ne les comprend pas, mais il dispose néanmoins d'une instruction propriétaire:
width:expression(document.body.clientWidth < 740 ? "740px" : "auto" );
(test: si largeur du doc <740 alors largeur=740, sinon largeur auto)



Pour empêcher le chevauchement des boites, tu as la propriété CSS clear

Une aide sur le modèle de mise en forme CSS ici: http://www.yoyodesign.org/doc/w3c/css2/visuren.html
Messages postés
4
Date d'inscription
samedi 9 juillet 2005
Statut
Membre
Dernière intervention
20 janvier 2007

Je ne vois pas comment utiliser ce que tu me conseille apparamant ça fait planter mon navigateur IE6
width:expression(document.body.clientWidth < 740 ? "740px" : "auto" );
Messages postés
131
Date d'inscription
mardi 21 septembre 2004
Statut
Membre
Dernière intervention
23 septembre 2011

le code est à placer dans la feuille CSS.
Il est fonctionnel sous IE7, IE6 je pense aussi (à confirmer)
Messages postés
4
Date d'inscription
samedi 9 juillet 2005
Statut
Membre
Dernière intervention
20 janvier 2007

Oui c'est bien ce que j'ai fait je l'ai mis dans ma feuille CSS mais ca fait planter mon navigateur IE6

#Mise_IE {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width:expression(document.body.clientWidth < 900 ? "900px" : "90%" );
    height:820px;
    background-color: #3300CC;
    border: thin solid #FFFFFF;
    }
Messages postés
131
Date d'inscription
mardi 21 septembre 2004
Statut
Membre
Dernière intervention
23 septembre 2011

j'ai lu que le plantage peut survenir, notamment en cas de cumul d'expressions.
je te laisse le lien complet:
http://www.eklesia.net/spip.php?article115
plus d'infos sur google:
 http://www.google.fr/search?hl=fr&q=width%3Aexpression&btnG=Recherche+Google&meta=lr%3Dlang_fr
(dommage, alsacreations ne fonctionne plus)