網頁

2007年12月18日 星期二

讓 ie 也有「最小寬度」的效果

min-width 是個非常方便的 css 命令，它可以指定元素最小也不能小於某個寬度，這樣就能保證排版一直正確。但瀏覽器市佔率最高的 ie 卻不認得這個標準指令，而它實際上把 width 當做最小寬度來使。而在網路上看到其他網友，為了讓這一命令在 ie 上也能用，大多都是用一個 <div> 放到 <body> 的方式來處理，如下：
<body>
<div class="container“>
...
</body>

然後在 CSS 部份加入：
#container {
min-width: 600px;
width:expression(document.body.clientWidth < 600? "600px": "auto" );
}
可參考「最大寬度與最小寬度網頁設定」

而筆者想到在 xuite css 中，有一行指令可以讓 xuite blog 在 ie 中也有最小寬度的限制效果，所以我就將那行敘述用到了 blogger html/css 之中，結果真的可以達到我要的效果，而且只要在 html/css 中加入一行敘述就可以了，真的是很簡捷有效。

以下為我在 blogger html/css 中「最小寬度」的設定方式：
body {
...
min-width: 760px;
behavior: expression(this.style.width=(document.documentElement.offsetWidth<760)?"760px":"100%");
}
其中 min-width 在 ie6 中無效，而 behavior 為 ie 專屬，對 fx 無效。
標籤：

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)