Sideway HTML中的內容溢出

我有以下情況，有一個div，我正在向它動態添加內容。到目前爲止，如果添加的內容太多，它會在div外溢出或延長div。這兩種情況對我來說都是不受歡迎的。Sideway HTML中的內容溢出

enter image description here

我想要做的就是溢出一側的內容，在一個單獨的列。我爲此使用了自舉流體柱，但即使是不依賴靴子的解決方案也會對我有好處。

我最後的選擇是封裝代碼在一堆if和else並據此提出兩列中的內容，但我認爲有可能是一個更簡單的解決這個問題。

感謝

這裏是的jsfiddle的要求http://jsfiddle.net/eak4e/1/

some compulsory code

來源

2014-02-28 Tomarinator

可以提供一個小提琴嗎？ –

我已經更新了我的問題，提示@CodingAnt – Tomarinator

@Tomarinator，所以你會有固定的高度，實際上？ – sinisake

一個解決方案（IE10 +）是CSS列。這裏是一個小提琴http://jsfiddle.net/wkr7X/

div.text-columns-three 
{ 
/*Shamless copy of: http://compass-style.org/examples/compass/css3/columns/*/ 
    -webkit-column-count: 3; 
    -moz-column-count: 3; 
    -ms-column-count: 3; 
    -o-column-count: 3; 
    column-count: 3; 
    width: 300px; 
    margin-bottom: 20px; 

    height: 300px; 
}

有喜歡column-break-inside

更新一些有趣的特性：這裏是一個簡短的試驗不同的顯示類型：http://jsfiddle.net/wkr7X/1/似乎有塊元素的工作，只要內容不是一個區塊，而是分成幾個實體

來源

2014-02-28 09:49:07

Sideway HTML中的內容溢出

回答

相關問題