如何在博客中的內容和側欄小部件之間的空間？

Question

我想在主要內容和側邊欄之間添加一些空間，在黑色空間中，必須顯示背景圖像，我不想添加邊框。

查看我的博客模板截圖。 圖片鏈接： - http://i.stack.imgur.com/xxpfV.jpg

因此，主內容和側邊欄之間沒有任何空白區域。

看到另一個截圖，在這張照片中，你會看到主要內容和側邊欄之間的一些空間。 image link- http://i.stack.imgur.com/Y5bld.jpg

所以我想要添加這樣的空間，任何人都知道如何用margin和padding做到這一點？

我使用簡單的白色博客模板，所以在哪個類或ID，我需要添加CSS代碼？

非常感謝您的任何幫助。

Answer 1

HTML代碼：

<div id="wrapper"> 

    <div id="left"> 
     <p>The left-hand content</p> 

    </div> 

    <div id="right"> 
     <p>The right-hand content</p> 
    </div> 

</div> 

這裏是CSS：

#wrapper 
{position: fixed; 
top: 0; 
bottom: 0; 
right: 0; 
left: 0; 
display: block; 
width: 100%; 
background-color: #ffa; 
    } 

#right {position: absolute; 
border-radius: 5px 10px/10px; 
    top:5%; 
    right: 10%; 
    bottom: 0; 
    width: 17%; 
display: block; 
background-color: #ccc; 
overflow: auto; 
    } 

#left {width: 60%; height:100%; 
border-radius: 5px 10px/10px; 
margin-top:2.5%;  
margin-left: 10%; 
    margin-right: 16%; 
display: block; 
background-color: #0ff; 
overflow: auto; 
    } 

p {display: block; 
margin: 0.5em; 
padding: 0.2em 0.5em; 
    } 

上面的代碼看起來像這樣的圖像 http://i57.tinypic.com/29wv614.png