28217 sujets

CSS et mise en forme, CSS3

Min-width et ie

Bonjour à tous,

Je suis en train de travailler sur un site (kellibickman.net) et j'utilise l'attribut min-width sur mon header, qui, bien entendu, ne marche pas sur ie. En parcourant le forum, je suis tombé sur cette intervention :

a écrit :
J'ai trouvé une page qui peut en interesser pas mal d'entre vous car elle donne un code (qui marche j'ai vérifié) pour appliquer des max/min aux width et height.
Voici le lien : http://www.svendtofte.com/code/max_width_in_ie/

Pour les min, il y a également la solution de Raphaël (qui utilise des hacks et qui me semble plus propre). Mais pour les max cette solution est franchement pas mal.


D'où ma question : quelle est cette fameuse solution de Raphaël utilisant des hacks? J'ai cherché dans le forum, et je n'ai rien trouvé. Quelqu'un la connait-il? Je remercie d'avance celui (ou celle) qui pourra m'aider (et les autres qui ont pris la peine de lire ce message)
Administrateur
korben a écrit :
D'où ma question : quelle est cette fameuse solution de Raphaël utilisant des hacks? J'ai cherché dans le forum, et je n'ai rien trouvé. Quelqu'un la connait-il? Je remercie d'avance celui (ou celle) qui pourra m'aider (et les autres qui ont pris la peine de lire ce message)

A tout hasard, la FAQ, mais comme le dit la citation, la solution concerne min-height et non pas min-width.
Modifié par Raphael (03 Nov 2005 - 10:13)
A tout hasard, voici la formule magique que j'utilise pour min-with (Elle se décline pour les autres propriétés de ce type), elle nécessite javascript sous IE :
#mon-element {min-width:950px;width:expression(document.body.clientWidth < 950? "950px": "auto" )}
Merci beaucoup pour vos réponses.

J'ai essayé la solution de Xavier, et ça marche parfaitement. Le résultat sur : http://kellibickman.net/kelli.php

L'utilisation d'expression m'a permis en plus de résoudre un problème que j'avais poser ici et auquel personne n'avait pu me répondre : avoir un cadre qui part de top:100px et dont la hauteur est égale à celle de la fenêtre - 100px.

a écrit :
div#frame {
top: 100px;
left: 100px;
width: expression(document.body.clientWidth -100);
height: expression(document.body.clientHeight -100);
position: absolute;
overflow: auto;


Mais cela m'a créé un nouveau problème (cela m'aurait étonné!) : ce cadre contient une pseudo frame et utilise l'attribut overflow: auto;

Ce qui marchait parfaitement avec width: 100% et height: 100%.

Mais maintenant que la taille est définie par une expression, overflow: auto ne fonctionne plus sous firefox (ça marche sous ie). A chaque fois que je demande de recharger la page (sans toucher à la taille de la fenêtre), Firefox me donne une taille complétement différente au cadre.

Est-ce quelqu'un sait pourquoi et comment y remédier?

PS : j'en profite pour poser une petite question qui n'a aucun rapport avec ce sujet : dans le header de la page kelli.php (http://kellibickman.net/kelli.php), le dessin de la tête en haut à gauche est là grâce l'attribut "float: left".

Tout marche bien sur firefox, mais sous ie, l'image ne se colle pas tout à fait à gauche et l'image d'après (celle avec "kelli bickman" et qui a aussi l'attribut float: left) est décalée aussi (du même espace multiplié par 2, car il y a l'espace qui suit l'image 1 et celui qui précède l'image 2) et même chose à la fin de cette image. Pour résumé, l'image est entourée à doite et à gauche d'une zone de "on ne rentre pas!". Pourquoi, monde cruel?
Modifié par korben (04 Nov 2005 - 05:15)
Une question au lieu d'une réponse. Si on met une expression dans du CSS width: expression(document.body.clientWidth -100); comment se comportera le site avec javascript désactivé (pas le moyen d'essayer actuellement) ?
J'ai vérifié sous safari, l'overflow ne marche pas non plus. En fait, y a qu'avec ie que ça fonctionne (je devrais être content : fonctionner... ie... deux mots qui vont d'habitude rarement ensemble)
Modifié par korben (04 Nov 2005 - 15:51)
Sujet clos
Aller à