側邊欄位往下跑 - 部落格

By Ina
at 2008-08-27T21:17

Table of Contents

問題好像是出在#content{}的width太小了
我就你的範本結構畫個簡圖給你看~

本來在還沒有用css去控制之前，大略的區塊是長這樣:
┌────────────────┐
│ body(網頁整體) │ <body>
│┌──────────────┐│
││ #page(網誌整體) ──┼┼→ <div id='page'>
││┌────────────┐││
│││ #header(標頭) │││ <div id='header'>網誌名稱</div>
││└────────────┘││　　　　
││┌────────────┐││
│││ #content │││ <div id='content'>
│││┌──────────┐│││
││││ .post(文章) ││││ <div class='post'>文章</div>
│││└──────────┘│││
│││┌──────────┐│││
││││ #sidebar(側欄) ││││ <div id='sidebar'>側欄</div>
│││└──────────┘│││
││└────────────┘││ </div>
││┌────────────┐││
│││ #footer(底端) │││ <div id='footer'></div>
││└────────────┘││
│└──────────────┘│ </div>
└────────────────┘ </body>

如上圖所示，各區塊是依右邊html原始碼的順序來排列，且大小一致
經過css設定它的寬高和位置以及細部內容的外貌後
才會像你現在網誌的樣子

但你看喔，你的#content{}寬度才680px
可是.post下面包含的.entry{}寬就640px了
導致寬220px的#sidebar塞不下，所以就掉到下面去了

解決方式是拿掉#content{}的寬度設定
這樣#content就會跟#page一樣都是寬950px
950-(640+220)=90 你還有90px的空間可以應用
看是要拿來padding(補白)還是再各給文章和測欄多給一點都可以

※ 引述《vic4370 (嗄ㄚˊ)》之銘言：
: 這是我的網誌：http://oleandergarden.blogspot.com/
: 我的網誌從八月起
: 側邊欄就開始亂跑
: 常常跑到文章底下
: 我想說是文章欄寬度的問題
: 但是改了width後
: 問題還是沒有解決
: 我曾嘗試使用最原始的、Blogger原創的template
: 這個問題好像又消失不見了
: 我也不清楚是不是新template的問題
: 嗚嗚！經營兩年多的網誌
: 裡面有很多很花心思寫的文章啊～～
: 不想因而廢掉....
: 拜託大家的解答了

--
http://lingshu1005.blogspot.com/
something about my life

--

Tags: 部落格

All Comments

By Sandy
at 2008-08-29T16:01

這篇可以M了～

By Hardy
at 2008-08-29T20:45

好專業

側邊欄位往下跑 - 部落格

All Comments

Related Posts

統整一下痞客幫改後台之後的BUG吧

側邊欄位往下跑

痞客相簿封面全部被更換

統整一下痞客幫改後台之後的BUG吧

pixnet人氣?