Question

我最近开始学习语义ui。

问题是我不知道为什么“段”宽度会溢出“容器”。

=> jsfiddle更清楚。

还有其他替代解决方案吗？

除了网格系统之外，我也在努力填充（没有接触自定义抄送）

谢谢您的任何建议。

<div class="ui container">
    <header>
        <h1 class="ui huge header">Your Logo
            <span class="ui sub header">Using Single layout to create several looks</span>

        </h1>

    </header>

    <div class="ui inverted brown segment">
        <div class="ui inverted secondary  menu">
            <a class="ui brown big button">
                Home
            </a>

            <a class="ui brown big button">
                Messages
            </a>
            <a class="ui brown big button">
                Friends
            </a>
        </div>
    </div>


    <div class="ui grid">
        <div class="row">
            <div class="ui inverted  green placeholder segment column">

            </div>
        </div>

    </div>




</div>

Answer 1

该段将从容器溢出，因为语义网格使用负边距。网格的所有边都有-1rem的边距，以确保flex网格与容器的外部正确放置。因为网格列的侧面有一个沟槽。使用padded grid变体可以使其正常工作。 https://semantic-ui.com/collections/grid.html#negative-margins

段在语义ui中溢出容器？

1 个答案: