CSS3中是否存在列最小寬度和最大列數？

我在看http://www.w3.org/TR/css3-multicol/，但它只允許你指定column-width和column-count，可能兩者都是（單獨或通過columns），但沒有定義任何方式來指定例如最小寬度和最大數量。CSS3中是否存在列最小寬度和最大列數？

例如，在category index of OpenBSD ports上，有71個類別，通常適用於9em。

如果我使用ul {-moz-column-width: 9em;}，則在89em以上，存在會是至少9列（89em = 9 × 9em（列寬度）1EM的+ 8 ×（列間隔）），使得每個列包含很少的類別，並且，恕我直言，使得導航更加困難，因爲即使文本「看起來」從左到右，您仍然必須自上而下導航。（或者有沒有辦法讓列的列表從左到右，而不是從上到下）

如果我改爲使用-moz-column-count: 8;，那麼該網站在較小屏幕上的可用性會降低，低於約70em或者。

有沒有解決方案？

來源

2015-04-30 cnst

是的，我們可以使用@media查詢爲不同的屏幕指定不同的規則。

http://www.w3.org/TR/css3-mediaqueries/

ul { -moz-columns: 9em; } 

@media (min-width: 89em) { 
    ul { -moz-columns: 8; } 
}

來源

2015-04-30 16:07:27 cnst

@andi，什麼錯字？ – cnst

你有-moz-columns而不是-moz-column-width。實際上，現在我再次查看，在媒體查詢中，您應該真正擁有-moz-column-count。而我們在這裏，-webkit廠商前綴和非前綴版本。 – andi

@andi，我仍然不明白錯字是什麼。 '-moz-columns：9em'出於某種原因不適合你？它在這裏工作得很好。 – cnst

CSS3中是否存在列最小寬度和最大列數？

回答

相關問題