28220 sujets

CSS et mise en forme, CSS3

[Résolu] - Pourquoi min-width ne marche pas ?

Bonjour,

Pourquoi lorsque j'utilise min-width, cela ne marche ni sur Mozilla, ni sur IE ? Je sais bien que cette propriété n'était pas censée être supportée par IE, mais là je n'arrive même pas à la faire marcher sous Mozilla.

Je le fais sous une div, c'est pourtant autorisé, non ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- Date de création: 10/11/2005 -->
<head>
<title>plop</title>
<style type="text/css">
.my_div {
	min-width:	15px;
	background-color:	#FFFF66;
}
</style>
</head>
<body>
<div class="my_div">Tiny</div>
<div class="my_div">A very big big big big string for a big big big div</div>
</body>
</html>

Voir l'exemple uploadé
Modifié par DrySs (13 Nov 2005 - 18:54)
agilis a écrit :
Bonjour,

Où est le problème? Tes deux div font bien au minimum 15px de largeur...

a+
Bah non, elles occupent tout l'écran...

Je voudrais une div qui fasse 15 pixel de largeur, et si le texte dedans est plus grand que 15 pixels, elle s'élargit autant qu'il le faut pour le faire rentrer dedans.

La div ne fait en rien 15 pixels là... Elle fait du 100% de l'écran Smiley cligne
Administrateur
Dans ce cas, il faut la bloquer avec un max-width.

C'est le comportement normal :
1- l'élément div, par défaut, occupe toute la largeur disponible.
2- En lui indiquant qu'il doit faire au minimum 15px de large, cela ne contredit pas la règle 1

En clair ton div fait exactement ce qu'on attend de lui : 15px au minimum, et toute la largeur puisque c'est sa taille par défaut.

PS : attention, ton XHTML 1.1 n'en est pas en fait :
http://forum.alsacreations.com/faq/#item42
Elles font bien 100% mais c'est normal!

Les div font 100% de largeur par défaut, sauf s'ils sont vide.

La propriété min-width permet de déterminer une largeur minimale si le div est vide (corrigez-moi si je me trompe).

a+

Edit : grilled...
Edit bis : Ma solution ne fonctionnait pas...
Modifié par agilis (13 Nov 2005 - 18:12)
Raphael a écrit :
Dans ce cas, il faut la bloquer avec un max-width.

C'est le comportement normal :
1- l'élément div, par défaut, occupe toute la largeur disponible.
2- En lui indiquant qu'il doit faire au minimum 15px de large, cela ne contredit pas la règle 1

En clair ton div fait exactement ce qu'on attend de lui : 15px au minimum, et toute la largeur puisque c'est sa taille par défaut.

PS : attention, ton XHTML 1.1 n'en est pas en fait :
http://forum.alsacreations.com/faq/#item42
Ouip, mais ca m'aide pas du tout dans ce que je veux faire alors Smiley langue

J'ai du partir sur une mauvaise piste parce que moi ce que je veux faire c'est :

- Fixer une div d'une largeur minimum, par exemple 15 px.
- Elle fera donc 15 pixels de large, SAUF si le contenu inséré dedans est plus large que ces 15 pixels. Dans ce cas elle se redimensionnera toute seule pour faire entrer entièrement le contenu à l'intérieur.

Je ne connais pas la largeur de ce contenu. Comment faire donc, c'est pourtant une opération des plus simples ?
.my_div {
	white-space:nowrap ;
	width : 35px;
	min-width:auto;
	background-color:	#FFFF66;
}


C'est un peu mieux, mais pas encore ça, non ?
Djano a écrit :
.my_div {
	white-space:nowrap ;
	width : 35px;
	min-width:auto;
	background-color:	#FFFF66;
}


C'est un peu mieux, mais pas encore ça, non ?
Bah la div s'aggrandit pas comme je le voudrais Smiley smile

Ya donc aucun moyen en CSS de faire un truc aussi simple que ça ? Smiley eek
Administrateur
Il n'y a pas beaucoup de méthodes pour limiter la taille d'un bloc à son contenu :
- soit le positionner en absolu
- soit le positionner en flottant

Dans les deux cas, si tu n'indiques pas de largeur au bloc, il prendra la largeur de son contenu.

Tu peux essayer ça :
.my_div {
float: left;
clear: left;
min-width:	15px;
background-color:	#FFFF66;
}


DrySs a écrit :
Ouip, mais ca m'aide pas du tout dans ce que je veux faire alors Smiley langue
Non, mais il vaut mieux le savoir : ton document est hybride et ne correspond actuellement à aucune norme
Modifié par Raphael (13 Nov 2005 - 18:43)
Raphael a écrit :
Il n'y a pas beaucoup de méthodes pour limiter la taille d'un bloc à son contenu :
- soit le positionner en absolu
- soit le positionner en flottant

Dans les deux cas, si tu n'indiques pas de largeur au bloc, il prendra la largeur de son contenu.

Tu peux essayer ça :
.my_div {
float: left;
clear: left;
min-width:	15px;
background-color:	#FFFF66;
}


Non, mais il vaut mieux le savoir : ton document est hybride et ne correspond actuellement à aucune norme
Marche très bien sous IE , mais pas sous Mozilla :'(

Par ici l'exemple
Ha si ca marche très bien, mes excuses, et un grand merci pour cette astuce.

(pardon pour le double post, mais le bouton Editer a disparu de chacun de mes posts, impossible donc de m'éditer !!).

Encore merci Smiley biggrin
Administrateur
DrySs a écrit :
(pardon pour le double post, mais le bouton Editer a disparu de chacun de mes posts, impossible donc de m'éditer !!).

Tu es sûr d'être connecté permanent ? Tu as bien le lien "Profil" en haut du forum ?
Raphael a écrit :

Tu es sûr d'être connecté permanent ? Tu as bien le lien "Profil" en haut du forum ?
Effectivement, je ne l'étais plus. Ce qui est bizarre c'est qu'à la base je l'étais mais je suis passé au statut déconnecté juste après avoir posté mon premier message Smiley biggol

J'édite mon titre en résolu Smiley cligne

Edit : ca viens de me le refaire, apparement dès que je poste un message, je suis déconnecté...


Smiley edit Modifié par DrySs (13 Nov 2005 - 18:53)
Raphael a écrit :
Tu peux essayer ça :
J'en profite pour glisser une autre question : comment faire pour centrer la div avec ton exemple ?

La div prends bien la largeur du texte, mais je n'arrive pas à la centrer au milieu de la page (enfin de la div où elle se trouve).
Administrateur
DrySs a écrit :
J'en profite pour glisser une autre question : comment faire pour centrer la div avec ton exemple ?

La div prends bien la largeur du texte, mais je n'arrive pas à la centrer au milieu de la page (enfin de la div où elle se trouve).

Ah ben oui mais si on ne donne pas tout l'énoncé du problème, ça n'arrange pas les choses. Comme l'explique l'Aide du forum, il faut toujours détailler au maximum son problème, ce qui éviterait d'avoir des réponses inadaptées... la mienne par exemple.

Float est fait pour être à droite ou à gauche, pas pour être centré, même si des bidouilles pourraient arranger ça.

Je te suggère alors de choisir l'autre méthode que je t'ai indiquée : positionner ton bloc en absolu, et centrer ce bloc dans son conteneur si celui-ci est lui-même positionné.
Sujet clos
Aller à