- 締切済み
ページを拡大縮小でborderが消える場合の対処法
Firefoxで開いたページctrl+マウスのクルクルで拡大縮小すると tableの上下に設定したborderが部分的に消えてしまいます。 下記コードは自分のページに使われているのを似せて作りました。 消える具合を再現しようとしたのですが消えませんでした。 一部しか似せてないからでしょうか。 ページトップにあるボタン複数は、 マウスオーバーで画像が切り替わるのをCSSで作ってありますが、 それは関係ないですよね。 IE9、IE8、chromeは消えませんが、Firefoxでは消えてしまいます。 こういったバグは一体何が原因で起こるのでしょうか? 何か改善方法はありませんか? 最も私が求めているアドバイスは、 例えば、 『floatで指定した値と同じ方向にmarginの指定をすると、 指定値の倍程度になってしまうバグを解消するには、 floatとmargin が同じ方向のプロパティを持つ要素に display:inline;を付け加える』 これが理想ですが、でもヒントだけでも頂けると助かります。 宜しくお願い致します。 <html> <head> <title>テスト</title> <script language="JavaScript" type="text/javascript"> <!-- function openwin(url, winname, width, height) { if(!width) { width = 600; } if(!height) { height= 400; } if(!winname) { winname = 'win'; } w = window.open(url, winname,'width=' +width+ ',height=' +height+ ',status=no,scrollbars=yes,directories=no,menubar=no,resizable=yes,toolbar=no'); } //--> </script> <style type="text/css"> table.aaa{ width:750px; border-top:1px solid #333; border-bottom:1px solid #333; border-collapse:separate; border-spacing:0; text-align:center; margin-top:30px; } td.bbb, td.ccc{ padding:30px 30px; } td.ccc{ width:100px; background:#000; color:#fff; } ul{ width:750px; margin-left: -23px; overflow:hidden; } ul li { display: inline; width: 200px; margin-left: 30px; float: left; } ul li img { display: block; border: 1px solid #555; } </style> </head> <body> <form method="post"><input type=button onClick="openwin('xxx.html');" value="テスト"> </form> <span class="eee"><a name="t1" id="t1">NO1</a></span> <table class="aaa"> <tr> <td class="ccc">テスト1</td> <td class="bbb">※※※※※※※※※※</td> </tr> </table> <ul> <li><a href="xxx.html#w1"><img src="sample.jpg" width="200" height="150" ></li> <li><a href="xxx.html#w2"><img src="sample.jpg" width="200" height="150" ></li> <li><a href="xxx.html#w3"><img src="sample.jpg" width="200" height="150" ></li> </ul> <ul> <li><a href="xxx.html#w4"><img src="sample.jpg" width="200" height="150" ></li> </ul> <table~…~</ul>まで10個ほど繰り返しされます。<li>の数は一項目最大9個ほど
- みんなの回答 (1)
- 専門家の回答
みんなの回答
- taka451213
- ベストアンサー率47% (436/922)
こんばんは。 私のFirefoxで再現できませんでした・・・。 なんでかな?