左边框分离/破坏布局，布局居中

Question

我想居中分页

然而左边框出乎意料

如何解决？

样式表

.pagination a, .pagination span.current, .pagination span.gap {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: white;
    border-color: #ddd;
    border-image: none;
    border-style: solid;
    border-width: 1px 1px 1px 0;
    line-height: 0;
    padding: 0 14px;
    text-decoration: none;
}
.pagination {
    border-left: 1px solid #ddd;
    display: block;
    margin-top: 40px;
    text-align: center;
}

Answer 1

您正在向块包装器添加左边框：

.pagination {
    border-left: 1px solid #ddd;
}

相反，您应该将它添加到第一个内部元素：

.pagination > span:first-child {
    border-left-width: 1px;
}

左边框分离/破坏布局，布局居中

left border is detached/ broken layout with centered layout

css

sass

样式表