帶邊框的段落

Question

我在頁面上有幾段我想添加邊框。

<p class="valid">paragraph</p> 

CSS

p.valid { 
padding:5px; 
border: 1px solid #ccc; 
} 

問題是這樣的顯示paragrph作爲頁面

100％我還試圖加入內聯塊它包裝爲我想的內容，但內聯就像左邊的浮動。

p.valid { 
padding:5px; 
border: 1px solid #ccc; 
display: inline-block; 
} 

Answer 1

當浮動元件，也將其設置爲clear任何（左）浮動元素：

p.valid { 
    padding:5px; 
    border: 1px solid #ccc; 
    display: inline-block; 
    float: left; 
    clear: left; 
} 

從MDN documentation：

的clear CSS屬性指定是否一個元件可以在其之前的浮動元素旁邊或必須在其下面移動（清除）

Answer 2

我會使用<span>標記而不是<p>，因爲段落應該延伸到整個頁面，並且看上去<span>會幫助您更好地完成所要完成的任務。