sidebar掉到最下面 - 部落格

Table of Contents

你的#outer-wrapper只有850

文章區塊+側欄已經用掉750

剩下的100px呢

其中50px給了文章區塊的margin (左右各25px)

另外的50px給了側欄的margin (同上)

就用光了

所以增加margin之後就掉下去啦~~~

請直接加大#outer-wrapper再來動margin囉

其實也不用都由margin來控制邊界距離

padding的補白作用也可以有類似的效果

※ 引述《lockes (少女愛情丸子串。)》之銘言:
: http://lux-test.blogspot.com/
: 這是我blog的版型 (現在這是正常狀況)
: 左邊主要資訊列和右邊的sidebar之間明明還有蠻大的差距
: 但是我只要再左右兩邊多加一點寬度,
: 不過左右增加的寬度都還小於兩列中間的寬度
: 可是sidebar整列就會被擠到最下面
: 以下是我這是我設定的數值...
: 有高手能幫我看看問題出在哪嗎?
: /* Outer-Wrapper
: ----------------------------------------------- */
: #outer-wrapper {
: width: 850px;
: margin:0 auto;
: padding:0px;
: text-align:$startSide;
: font: $bodyfont;
: }
: #main-wrapper {
: width: 500px;
: margin: 25px; <--我想設定30px,但sidebar就被擠到下方去了
: float: left;
: word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
: overflow: hidden; /* fix for long non-text content breaking IE sidebar
: float */
: }
: #sidebar-wrapper {
: width: 250px;
: margin: 25px; <--我想設定30px,但sidebar就被擠到下方去了
: float: right;
: word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
: overflow: hidden; /* fix for long non-text content breaking IE sidebar
: float */
: }

--

All Comments

Tracy avatarTracy2009-10-08
padding的作用好像跟margin一樣都是影響左右側
Connor avatarConnor2009-10-08
我一開始設想的是main和sidebar之間的距離能縮小,不過看似
Todd Johnson avatarTodd Johnson2009-10-11
都會受到兩邊留白的寬度影響
Hedy avatarHedy2009-10-14
padding跟margin是很像 但還是有差別喔~~
Eden avatarEden2009-10-15
padding是增加寬高讓內容看似往內縮 margin則是減掉寬高
Tristan Cohan avatarTristan Cohan2009-10-16
所以padding才會叫做補白
Hedy avatarHedy2009-10-18
我個人的習慣是調整文字邊界就用padding
調整區塊邊界就用margin
Oliver avatarOliver2009-10-20
B大推文太可惜了 ^^