Blockquote背景顏色follow line length

Question

嗨，是可以使我的塊引用的背景遵循文本行的長度。這裏是我的一塊引用

<blockquote> 
<p>£265,000 will make an XXL difference</p> 
</blockquote> 

的下面的代碼我現在的CSS：

blockquote p { 
    padding: 10px!important; 
    text-align: right!important; 
    font-size: 33px!important; 
    color: #fff!important; 
    font-weight: 600!important; 
    font-family: $heading-fancy!important; 
} 
blockquote { 
    background-color: #183052!important; 
    float: right!important; 
    width: auto!important; 
    max-width: 250px!important; 
    margin: 10px 0!important; 
} 

這裏是如何，目前看起來。 https://jsfiddle.net/2atm3ktn/

是否有可能做到這一點看用背景色... https://s7.postimg.org/m29mkdwhn/example.png

我已經通過添加額外的容器（格），並使用邊框上的標題之前達到這個效果。理想情況下，blockquote周圍不會有更多標籤，因爲用戶只需點擊所見即所得中的blockquote即可。

想法歡迎。

Answer 1

你可以這樣做，希望它有幫助。

blockquote p { 
 
    padding: 10px!important; 
 
    text-align: right!important; 
 
    font-size: 33px!important; 
 
    color: #fff!important; 
 
    font-weight: 600!important; 
 
    font-family: $heading-fancy!important; 
 
    margin: 0; 
 
    
 
} 
 
blockquote { 
 
    background-color: #183052!important; 
 
    float: right!important; 
 
    width: auto!important; 
 
    max-width: 250px!important; 
 
    margin: 10px 0!important; 
 
    padding: 0; 
 
} 
 
span{ background-color: green;}

<blockquote> 
 
<p> 
 
<span>£265,000 will make an XXL difference</span> 
 
</p> 
 
</blockquote>