input type="file"の幅と高さ

FireFox12で、ファイルを取り扱うフォーム部品のボックスの高さと幅が変更できません。
type属性がtextboxだとFireFoxでもCSSがちゃんと適用されます。

<input type="file" name="sample" class="test" />

.photo {
width:580px;
height:20px;
}

としていますが、IE8/9 Safari5.1.7/Chrom19では指定した幅と高さになるのですが
FireFoxだけ変化しません。

どうしようもないのでしょうか？

No.2 ベストアンサー 回答者： LancerVII 回答日時： 2012/06/27 08:35

こんにちは。

Firefoxのtype="file"については昔のバージョンからwidthやheightが効かないようです。
横幅だけならsize=""で変更できます、
高さは諦めるしかなさそうです。

この回答へのお礼

＞Firefoxのtype="file"については昔のバージョンからwidthやheightが効かないようです。

そうなんですね・・

なるほど、sizeでいけますか。どうしても横幅だけは変えたかったです。
ありがとうございます。


ちなみに。class名はtestの間違いです。
それでもwidthとheightは適用されません。

.test {
width:580px;
height:20px;
}

お礼日時：2012/06/27 09:21

No.1 回答者： ORUKA1951 回答日時： 2012/06/27 08:30

＞FireFox12で、ファイルを取り扱うフォーム部品のボックスの高さと幅が変更できません。

　質問がわからないのですが・・

　フォームの部品--コントロール( http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401 … )--のことだと思いますが、コントロールは「インライン要素( ブロックレベル要素と行内要素 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … ) )」ですし、非置換インライン要素ですからwidthプロパティは持ちえませんから、どのことを指すのかわからないです。

　文字通り「ファイルを取り扱う[コントロール]のボックスの高さと幅が変更できません。」
でしたら
<form action="./">
　<dl>
　　<dt abbr="ファイル選択">
　　　ファイル
　　<dt>
　　<dd><!-- コントロールのボックス -->
　　　<input type="file" name="f1" size="40" tabindex="2" accesskey="F">
　　</dd>
・・・・・
　ですから、スタイルシートで
dt[abbr="ファイル選択"]+dd{width:60em;}
　とがでよいはずです。

　もしコントロール自体の幅を指定したいなら、コントロールのスタイルは、CSS的には「ユーザー指定の最重要宣言」扱いですから、著者がどうあがいても指定できないはずです。スタイルシートを解釈しないユーザーエージェント、スタイルシートを停止しているユーザーエージェントなどを考慮すれば、仕様どおり

<input type="file" name="f1" size="40" tabindex="2" accesskey="F">
　　　　　　　　　　　　　　　　　^^^^^^^^^^^^
とseze属性で指定すべきです。

この回答へのお礼

ありがとございます。

sizeでいけるんですね。

お礼日時：2012/06/27 09:24