Re: [Blogger] 狂賀!繼續閱讀功能推出啦!
您好,我是您所使用的繼續閱讀原作者
我嘗試停用所有的javascript(這是我的繼續閱讀所使用的核心),您的版面仍然是亂的
所以可以推測應該不是我所造成的問題 :)
關於套用上繼續閱讀後相當常見的版面錯亂,我的見解是:
將樣板小裝置復原回預設值時,版面的結構可能有改變
目前我已經無法取得您原始的樣板,但我猜測您原本的版面應該是這樣
┌─────content ─┐┌────┐
│┌────────┐││sidebar │ 每個方框表示一個div
││ main-wraper │││ │
││ (主區塊) │││(邊欄) │
││ │││ │
││ │││ │
││ │││ │
││ │││ │
││ │││ │
││ │││ │
││ │││ │
││ │││ │
││ │││ │
│└────────┘││ │
└──────────┘└────┘
而您原始(目前)的CSS是:
#content { float: right; width: 650px;}
#main-wrapper {}
#sidebar { margin-top: 90px; float: left; width: 301px;}
但在小裝置恢復預設值之後,樣板結構變成目前的樣子:
┌────content ──┐
│┌────────┐│
││ main-wraper ││
││ (主區塊) ││
││ ││
││┌────┐ ││
│││sidebar │ ││
│││(邊欄) │ ││
│││ │ ││
│││ │ ││
│││ │ ││
│││ │ ││
│││ │ ││
│││ │ ││
││└────┘ ││
│└────────┘│
└──────────┘
所以您的sidebar自然就掉了下來,因為他再怎麼float left 也逃不出已經folat right的
contet
為了讓以後仍然可以放心恢復成預設值,在不變動樣板div結構的前提下
請將css作以下修改:
#container{ position:relative; } /*變動*/
#content { float: right; width: 650px; } /*不變*/
#main-wrapper {} /*不變*/
#sidebar { margin-top: 90px; position:absolute; left: 0px; top:0px; width:
301px;} /*變動*/
這樣sidebar就可以脫離conten的限制,外觀也接近原本的div樣式
我尚未找其他也遭遇跑板問題的網誌測試,不過希望這樣的CSS可以幫上大多數網誌的忙
m(_ _)m
--
http://blog.kengao.tw/
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 140.116.191.78
推
11/17 03:21, , 1F
11/17 03:21, 1F
推
11/17 19:45, , 2F
11/17 19:45, 2F
推
11/18 10:33, , 3F
11/18 10:33, 3F
推
01/21 23:23, , 4F
01/21 23:23, 4F
推
07/30 19:20, , 5F
07/30 19:20, 5F
→
07/30 19:21, , 6F
07/30 19:21, 6F
討論串 (同標題文章)
完整討論串 (本文為第 5 之 5 篇):