我没有足够的代表来发布图像,但这是一个链接。
http://i.stack.imgur.com/eTp8Q.png
我在尝试找出合适的CSS / LESS以便在语义UI框架中在此处进行侧滚时遇到了麻烦。网格的这一部分有四列,我需要再添加四列,但是如果可以的话,请将它们隐藏在右边,直到将它们滚动到为止。
<div class="features ui grid noMargin">
<div class="four wide column greyOdd">Stuff here</div>
<div class="four wide column greyEven">More stuff</div>
<div class="four wide column greyOdd">Calls n stuff</div>
<div class="four wide column greyEven">Testing look</div>
</div>
我如何在此处添加更多列而不将它们转到下一行?
语义UI的Grids元素得到了display: inline-block
,因此您可以设置white-space:nowrap
为防止该元素排成一行:
<div class="features ui grid noMargin" style="overflow-y:auto;white-space:nowrap;">
<div class="four wide column greyOdd">Stuff here</div>
<div class="four wide column greyEven">More stuff</div>
<div class="four wide column greyOdd">Calls n stuff</div>
<div class="four wide column greyEven">Testing look</div>
<div class="four wide column greyOdd">Stuff here</div>
<div class="four wide column greyEven">More stuff</div>
<div class="four wide column greyOdd">Calls n stuff</div>
<div class="four wide column greyEven">Testing look</div>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句