CSSリキッドレイアウトのページを作成したいと思っています。 FirefoxやIE7では段落ちしないのですが、 IE6でウィンドウ幅を縮めたときに左ナビが段落ちしてしまいます。 IE6でも段落ちさせないためにはどうしたら良いものでしょうか。何か足りない点があるのだと思いますが、お知恵を拝借できないでしょうか。お手数ですが、よろしくお願いいたします。 CSSレイアウトテストコンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分コンテンツ部分左ナビ左ナビ左ナビ左ナビ左ナビ左ナビ左ナビ左ナビ左ナビ左ナビ左ナビ左ナビ main.css: #frame_wrapper { width: 99%; margin: 0; padding: 0; } #frame_column-content { width: 99%; float: right; margin: 0 0 0 -20em; } * html #frame_column-content { margin-right:-19.2px; } #frame_content { margin: 0 0 0 20em; background: white; } body { margin: 0; padding: 0; } .visualClear { clear: both; } .frame_portlet { width: 19em; overflow: hidden; }

IE6で段落ち

解決済

質問者：hideboo11
質問日時：2008/06/16 23:14
回答数：1件

CSSリキッドレイアウトのページを作成したいと思っています。
FirefoxやIE7では段落ちしないのですが、
IE6でウィンドウ幅を縮めたときに左ナビが段落ちしてしまいます。

IE6でも段落ちさせないためにはどうしたら良いものでしょうか。

何か足りない点があるのだと思いますが、
お知恵を拝借できないでしょうか。

お手数ですが、よろしくお願いいたします。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>CSSレイアウトテスト</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div id="frame_wrapper">
<div id="frame_column-content">
<div id="frame_content">
コンテンツ部分コンテンツ部分コンテンツ部分
コンテンツ部分コンテンツ部分コンテンツ部分
コンテンツ部分コンテンツ部分コンテンツ部分
コンテンツ部分コンテンツ部分コンテンツ部分
コンテンツ部分コンテンツ部分コンテンツ部分
コンテンツ部分コンテンツ部分コンテンツ部分
<div class="visualClear"></div>
</div>
</div>

<div class="frame_portlet">
左ナビ左ナビ左ナビ
左ナビ左ナビ左ナビ
左ナビ左ナビ左ナビ
左ナビ左ナビ左ナビ
</div>
</div>
</body></html>

main.css:
#frame_wrapper {
width: 99%;
margin: 0;
padding: 0;
}

#frame_column-content {
width: 99%;
float: right;
margin: 0 0 0 -20em;
}

* html #frame_column-content {
margin-right:-19.2px;
}

#frame_content {
margin: 0 0 0 20em;
background: white;
}

body {
margin: 0;
padding: 0;
}

.visualClear {
clear: both;
}

.frame_portlet {
width: 19em;
overflow: hidden;
}