input type="file"

malicia · Message par **malicia** » 17 févr. 2005, 19:58

bonjour,

Normalement je gère la longueur des input, select et textarea avec les width en css. Le problème est que pour un input type="file" le width ne marche pas correctement. Ca agrandit bien le champ de saisie mais le bouton parcourir ne se décale par rapport au champ de saisie (sous firefox, sous ie c'est ok :p) il reste toujours à la même position quelque soit la taille du champ de saisie. seule solution utiliser le size dans l'input mais bon ...

allez voir ici pour voir les resultats http://dream.media-box.net/voir_post_100564.html#100564

c'est pareil chez vous ou c'est un bug mozilla ?

merci

calimo · Message par **calimo** » 17 févr. 2005, 20:46

On peut avoir le code complet ? Tu es sur de ne pas avoir laissé un size="..." dans le code ? Tu es sur qu'il n'y a pas de conflit avec une autre règle ?

malicia · Message par **malicia** » 17 févr. 2005, 21:26

je n'utilise jamais de size et je t'ai mis un exemple avec tous les types de champs de formulaires dans le code suivant ... vois par toi même mais je pense pas qu'il y ai d'erreur ou alors je suis fatiguée lol. j'ai essayé les longueurs en % comme en px ca change rien

Code : Tout sélectionner

<?xml version="1.0" encoding="iso-8859-1" ?>

<!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" xml:lang="fr" lang="fr">

<head>

  <style type="text/css">

  #conteneur
  {
  background-color: red;
  position : absolute;
  left: 50px;
  top: 50px;
  width: 400px;
  height : 290px;
  margin: 0px 0px 10px 0px
  }

  .champ
  {
  background-color: blue;  
  float: left;
  width: 380px;
  height: 60px;
  margin: 10px 10px 0px 10px;
  }

  .champ textarea, .champ select, .champ input
  {
  width: 50%;
  }

  </style>

</head>

<body>

<div id="conteneur">

  <div class="champ"> <textarea name="a"></textarea> </div>
  <div class="champ"> <select name="b"> <option value="1"> 1 </option> <option value="2"> 2 </option> </select> </div>
  <div class="champ"> <input type="text" name="c" /> </div>
  <div class="champ"> <input type="file" name="d" /> </div>  

</div>

</body>

</html>

psyco_thug · Message par **psyco_thug** » 17 févr. 2005, 22:07

Juste comme ça, essais avec un width:auto.

malicia · Message par **malicia** » 17 févr. 2005, 22:11

même chose :s ... ca vient donc de firefox ?

psyco_thug · Message par **psyco_thug** » 17 févr. 2005, 22:17

Alors triche! Met

Code : Tout sélectionner

.champ textarea, .champ select, .champ input
{
  width: 50%;
  background-color: transparent;
}

malicia · Message par **malicia** » 17 févr. 2005, 22:29

lol t'abuses. Ca s'appelle pas une solution ça. En plus je veux que le champ de saisie + le bouton parcourir occupent les 100% de mon div et ton transparent ne le fait pas ;). IE le fait bien lol alors .... lol

psyco_thug · Message par **psyco_thug** » 18 févr. 2005, 01:39

Je sais pas quel modification tu as fait à ton code mais moi sous firefox ça semble correcte:

J'ai utiliser le code que tu as mis dans le premier post.

malicia · Message par **malicia** » 18 févr. 2005, 04:07

ca l'est pas, augmente le width de input a 80% tu verras c'est flagrant... la taille du champ augmente en apparence et le bouton parcourir se trouve au milieu du champ de saisie comme ceci

en réalité le champ input ne bouge pas et s'arrete au bouton parcourir. je sais comment ca marche ce truc en fait.

Invité · Message par **Invité** » 18 févr. 2005, 06:26

J'avais raison! t'as juste à mettre:

Code : Tout sélectionner

.champ textarea, .champ select, .champ input
  {
  width: auto;
  }

et ça marche nickel!

malicia · Message par **malicia** » 18 févr. 2005, 13:33

Tu persistes en plus effronté. Relis mon post et mon problème ... je sais ce que je dis quand même ...

Ca montre quoi ton screen dis moi hein ? que t'avais raison sur quoi ? Moi je vois que t'as mis en evidence le select et c'est pas mon problème ca. Si tu sais pas passe ton chemin et laisse ceux qui savent me répondre.

merci

psyco_thug · Message par **psyco_thug** » 18 févr. 2005, 20:07

Je te comprend, bosser sur une page web et quand ce qu'on veut faire marche pas...ça nous énerve. Mea Culpa.

Je crois avoir trouver. Je me suis basé sur ceci:

http://www.w3schools.com/tags/tag_input.asp

Il faut mettre un 'size' à ton input.

Code : Tout sélectionner

<div class="champ"> <input type="file" name="d" size="" /> </div>

Parcontre faudra trouver la bonne mesure, 380px ou 80% ne font pas. J'ai fait des tests et la bonne taille se situe entre size="35" et 40.

malicia · Message par **malicia** » 18 févr. 2005, 21:38

mdr attend je me tire une balle et je reviens ..... ahhhh

regarde moi bien dans les noeils toi 8) et relis mon premier post... je cite:

... seule solution, utiliser le size dans l'input, mais bon ...

mais bon signifie dernière chose à envisager.

PsyDk · Message par **PsyDk** » 20 févr. 2005, 02:39

bug 52500

Malicia, tu vas devoir utiliser l'attribut « size ».

Mirovinben · Message par **Mirovinben** » 20 févr. 2005, 06:53

PsyDk a écrit :bug 52500

Malicia, tu vas devoir utiliser l'attribut « size ».

D'autant que personne n'a l'air de vouloir solutionner ce bug... avis aux amateurs !

Geckozone

input type="file"

input type="file"

Qui est en ligne ?