モバイルサイト<3キャリア>:auでwidth指定が無効化される?
モバイルサイト<3キャリア>:auでwidth指定が無効化される?
3キャリア共通仕様のHTMLサイトを作成しています。cssはインラインで使用しています。
あ行 あ い う え お
か行 か き く け こ...
のような「あいうえお表」を挿入したいのですが、タイトルのとおりauで表示が崩れます。
実現したい仕様は添付画像の【docomo,Softbank】のような形で、この2キャリアでは問題なく表示されています。
が、【au】で見ますとそれぞれの要素のwidth指定が無視され、100%表示されてしまっているようです。
該当部分のソースは、以下のとおりです。
<div style="background-color:#FFF; padding:5px; margin:0;">
<div style="background-color:#FFF; padding:5px; margin:0; width:10px; height:15px; display:inline;">あ行</div>
<div style="border:#333 1px solid; background-color:#FFF; width:15px; height:15px; padding:3px; margin-right:3px; display:inline;"><a href="list_a.html"><font color="#FF0066">あ</font></a></div>
<div style="border:#333 1px solid; background-color:#FFF; width:15px; height:15px; padding:3px; margin-right:3px; display:inline;"><font color="#FF0066">い</font></div>
<div style="border:#333 1px solid; background-color:#FFF; width:15px; height:15px; padding:3px; margin-right:3px; display:inline;"><font color="#FF0066">う</font></div>
<div style="border:#333 1px solid; background-color:#FFF; width:15px; height:15px; padding:3px; margin-right:3px; display:inline;"><font color="#FF0066">え</font></div>
<div style="border:#333 1px solid; background-color:#FFF; width:15px; height:15px; padding:3px; margin-right:3px; display:inline;"><font color="#FF0066">お</font></div>
</div><!--a end-->
思いつくままにスタイルを追加したので、その中に両立しないものがあるのかなと思うのですが、なにぶんまだ不勉強で・・・
tableで組み直すことも考えたのですが、それぞれのboxをborderで囲みたいのと間隔を空けたいため、ソースが今以上に膨大になってしまう気がして踏ん切りがつきません。
ここを直せばいい、tableでも組める等、お知恵をお貸しください。よろしくお願いいたします。
補足
すみません。 英語力がなくてわかりません。 日本語で書いてあるサイトは無いでしょうか?