legendの見え方？
フォームを作っているのですがfirefoxで見るとlegendの
width指定が全く効きません・・・
ie6で見ると意図したように表示されます！
display:block;などいろいろ試してみたのですがなにも
変わらずでした。
firefoxでも意図したように見えるためにはどうすれば
いいのでしょうか？宜しくお願いします。
---html---
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="stylesheet" href="../css/form.css" type="text/css" />
<title>title</title>
</head>
<body>
<div>
<form name="form1" method="post">
<fieldset>
<legend>情報1</legend>
<label for="name">氏名<span class="check">※</span></label>
<input type="text" name="NAME" class="w180" /><br />
<label for="address">住所<span class="check">※</span></label>
<input name="ADDRESS" type="text" class="w180" /><br />
</fieldset>
<fieldset>
<legend>情報2</legend>
<label for="tel">電話番号<span class="check">※</span></label>
<input name="TEL" type="text" class="w180" /><br />
<label for="fax">FAX番号</label>
<input name="FAX" type="text" class="w180" /><br />
</fieldset>
<p align="center"><input type="submit" value="送信" /></p>
</form>
</div>
</body>
</html>
---css---
fieldset {
display: block;
width: 500px;
margin: 0 auto 0.5em auto;
padding: 5px;
text-align: center;
border: solid 1px #278ed1;
font-family: verdana, sans-serif;
line-height: 1.5em;
}
legend {
display: block;
width: 180px;
height: 31px;
margin-bottom: 5px;
padding: 7px 0 3px 7px;
background: #fff url(../images/form/legend_bg.gif) no-repeat;
font-size: 1.1em;
font-weight: bold;
color: #fff;
text-align: left;
}
