Opera/Mac版IEでレイアウトが崩れる†
- ページ: BugTrack
- 投稿者: Wiki好き
- 優先順位: 低
- 状態: 完了
- カテゴリー: 本体バグ
- 投稿日: 2003-06-12 (木) 17:54:34
- バージョン:
メッセージ†
Skinの問題かと思われますが、Opera 7.XXと、Mac版IE 5.2XでMenubarあたりのレイアウトが崩れます。雑談ページがよう分かります。
- スタイルシートを調整しました。 -- ぱんだ
- この修正は良し悪しです。vertical-alignを設定すると、日本語フォントと欧文フォントが混在している場合、baselineが揃わなくなります。揃わない程度はブラウザによって異なりますが、baselineの乖離はIE6＜Mozilla＜Opera6/7の順で大きくなります。font-familyなどで日本語フォントと欧文フォントを混在指定している場合は、vertical-alignを使用しないほうがいいです。 -- reimy
- vertical-alignを使用する場合は、font-familyなどで日本語フォントと欧文フォントを混在指定しないようにしましょう。欧文も日本語フォントで表示するようにしておけば、vertical-alignを使用してもbaselineがきちんと揃います。 -- reimy
- なお、Opera6/7はfont-familyなどで日本語フォントと欧文フォントを混在指定している場合、日本語が思い通りのフォントで表示されなくなるというバグがあります。 -- reimy
- <td>のvalign属性をスタイルシートに移してしまったんですが、そういう問題がありますか。valign="top"はスキンに戻したほうがいいですかね。 -- ぱんだ
<table border="0" style="width:100%">
<tr>
<td class="menubar" valign="top"> <-
<div id="menubar"> MenuBar </div>
</td>
<td valign="top">
<div id="body"> 本文 </div>
</td>
</tr>
</table>
- いえいえ。戻さなくていいと思いますよ。vertical-alignは上付き文字など他の部分でも使ってますし。気にしだすとキリがない(笑い)。日本語フォントと欧文フォントを混在指定さえしなければまったく問題ないです(混在指定する人はほとんどいないでしょうし)。 -- reimy
- 雑談をOpera7.11で見るとメニューバーがつぶれます。 --
- div#menubarにwidth指定を追加しました。どうでしょうか。 -- ぱんだ
- official:質問箱で書いたのですが、CSSで下記のように指定しておくと、うまくいくはずです。 -- reimy
width:数値px;
max-width:数値px;
min-width:数値px;
word-wrap:break-word; /* IE対策 */
word-break:break-all; /* IE対策 */
overflow:hidden; /* Moziila/Opera対策 */
こうしておくと、MenuBarの幅が拡がったりすることはありません。
![[PukiWiki]](image/pukiwiki-dev.png "[PukiWiki]")
zatsu.png