28172 sujets
CSS et mise en forme, CSS3
Eh bien tout simplement en appliquant une taille en % (vu que les tailles en % sont des tailles qui sont proportionnelles à leurs contenus).
Donc par exemple :
Je n'ai pas défini de taille parce que je n'en vois pas trop l'utilité, mais tu peux le mettre si tu veux. Donc avec cet exemple, le champ <input /> prendrait 30% de la taille de son contenu.
Voilà
Modifié le 27 Nov 2004 - 02:21
Donc par exemple :
<div class="contenu">
<input type="text" />
</div>
.contenu
{
/* Définition de la taille du contenu */
width: 400px;
height: 300px;
background-color: #eee; /* Je mets #eee en couleur de fond pour qu'on voit un peu le fond ;o) */
}
/* Propriétés s'appliquant aux balises <input />
input
{
width: 30%;
background-color: #000;
color: #000;
}
Je n'ai pas défini de taille parce que je n'en vois pas trop l'utilité, mais tu peux le mettre si tu veux. Donc avec cet exemple, le champ <input /> prendrait 30% de la taille de son contenu.
Voilà
Modifié le 27 Nov 2004 - 02:21
Ce n'est pas aussi simple que ça
<input /> est un élément en ligne (inline) donc pas dimensionable, en %, en px, en em ou quoi que ce soit.
Donc il faut le passer en affichage en bloc grâce à display: block; et là le input prendra la largeur maximale comme tout élément de type bloc qui se respecte
Pour réduire la taille tu peux utiliser width: ...;
Voilà, @++
<input /> est un élément en ligne (inline) donc pas dimensionable, en %, en px, en em ou quoi que ce soit.
Donc il faut le passer en affichage en bloc grâce à display: block; et là le input prendra la largeur maximale comme tout élément de type bloc qui se respecte
Pour réduire la taille tu peux utiliser width: ...;
Voilà, @++
ElMoustiko a écrit :
Ce n'est pas aussi simple que ça
<input /> est un élément en ligne (inline) donc pas dimensionable, en %, en px, en em ou quoi que ce soit.
Normalement : si. (edit) (/edit)
Parmi les balises en-ligne, les éléments "remplacés" sont les seuls qui possèdent des dimensions (height, width) par défaut. Il s'agit des éléments IMG, INPUT, TEXTAREA, SELECT, et OBJECT.
Pour ces éléments, les valeurs width et height s'appliquent.
Sources :
http://www.w3.org/TR/REC-CSS2/visudet.html#Computing_heights_and_margins
http://www.w3.org/TR/REC-CSS2/visudet.html#Computing_widths_and_margins
Pour tous les autres éléments en-ligne :
- The 'width' property does not apply. A specified value of 'auto' for 'left', 'right', 'margin-left' or 'margin-right' becomes a computed value of '0'.
- The 'height' property doesn't apply, but the height of the box is given by the 'line-height' property.
Poire a écrit :
dans les deux cas ça marche pas bien, je peux pas vous en dire plus pour le moment, j'suis un peu débordé là.
Ptet plus tard, ou demain
Tu as bien précisé une hauteur au conteneur ? des pourcentages ne s'appliquent que par rapport à une hauteur définie.
Si la hauteur du conteneur est elle-même en %, il faut que le conteneur du conteneur soit défini, et ainsi de suite... jusqu'aux balises <body> et <html> si besoin est.