防止引用換行

我從服務器獲取一些文本，並使用標記將引號添加到前端。問題是有時只有最後的報價被包裝到一個新的行。我如何防止這種情況發生。防止引用換行

我不介意最後一個字是否與報價一起被包裹。

我已經嘗試過使用白色空間：nowrap文本，但我不知道事先知道文本的長度，所以我不希望它超過包含元素的寬度，所以white-space：nowrap不起作用。

編輯：

<div class="quote"> 
 

 
     <span class="quote-opening">&ldquo;</span> 
 
     <p class="quote-body">Some famous quote here thats being returned from the server 
 
      <span class="quote-closing">&rdquo;</span> 
 
     </p> 
 
           
 
</div> 
 

 

 
.quote{ 
 

 
\t .quote-opening{ 
 
\t \t width: 10%; 
 
\t \t display: inline-block; 
 
    \t \t vertical-align: top; 
 
\t } 
 

 
\t .quote-body{ 
 
\t \t width: 90%; 
 
\t } 
 

 
}

我想縮進只有文本和關閉的引號的權利與10px的幅度。這就是爲什麼我試圖做顯示：內聯塊爲開幕報價。

來源

2015-12-15 user3312156

在最後一個單詞和引號之間是否有空格結束？我做了一些檢查，而我得到的行爲是，如果一個單詞後面跟着一個引號並且引用不合適，那麼這個單詞會包裝。 – BurningLights

謝謝！我認爲這只是工作。將跨度移至與p標記一起工作的同一行。由於某種原因，服務器最後還是返回一個空格。如果有人看到這一點 - 檢查兩個以確保。 – user3312156

使用overflow:hidden應用到你的報價應該工作，但是這取決於您的實現。提供你的代碼會有所幫助。

This existing answer解釋了這種技術的應用。

來源

2015-12-15 01:31:39

防止引用換行

回答

相關問題