我的HTML中的奇怪间距只出现在Chrome中，而不是IE或Komodo Edit的预览中

Question

我是用jsfiddle写的。 https://jsfiddle.net/s2cq61ko/

下面是 HTML。

<div id="wrapper">
 <h2>I am a generalist</h2>
<div id="Boxy">
    <div id="GeneralistHeader">Stratgey & Design</div>
    <div id="General_List">
        <ul>
            <li class="Big">systems theory</li>
            <li class="Medium">branding</li>
            <li class="Small">ethnography</li>
            <li class="Small">statistics</li>
            <li class="Big">iOS development</li>
            <li class="Medium">user experience</li>
            <li class="Small">web development</li>
            <li class="Small">infographics</li>
        </ul>
    </div>
</div>
 <h2>Here are past projects</h2>
<p>that will let you see my thought process.</p>
</div>

那么这就是CSS...

#wrapper {
    max-width: 940px;
    margin: 0 auto;
    padding: 0 5%;
    text-align: center;
}
a {
    text-decoration: none
}
#GeneralistHeader {
    font-size:2em;
    font-weight: 700;
    background:#19334c;
    color:white;
    display:inline-block;
    padding: 2px 10px;
    margin: -20px 0 0 0;
}
#Boxy {
    border: solid;
    display:inline-block;
    border-width: 1px;
    margin-top: 35px;
    width:500px
}
#General_List ul {
    list-style-type: none;
    /*number of columns*/
    -webkit-column-count: 2;
    /* Chrome, Safari, Opera */
    -moz-column-count: 2;
    /* Firefox */
    column-count: 2;
    margin: 10px 0 0 0;
    padding: 0;
    font-family:'Raleway', serif;
    font-weight: 400;
}

请注意盒子后面的巨大间距。它不会出现在IE或Komodo Edit的预览中。但是当我在 Chrome 上打开它时，它显示为那样......

我确定这是 CSS，但我无法弄清楚。

Answer 1

最简单的解决方案是将 #Boxy 更改为：

#Boxy {
    border: solid;
    display: block;      /* from inline-block to block */
    border-width: 1px;
    margin-top: 35px;
    margin-left: auto;   /* added this line */
    margin-right: auto;  /* added this line */
    width: 500px;
}

Answer 2

这里有一些事情发生。一个是使用内联块可以产生奇数间距。如果您调整为使用显示块，然后应用左边距自动和右边距自动，您仍将居中框。我注意到的第二件事是，您已将 1.75em 的边距顶部应用于 h2。如果您将此声明更改为类，并且仅针对您打算调整边距的 h2，则该差距将消失。

Answer 3

看看这个链接

enter code here

您应该在显示屏上使用边距：0 auto;来定位您的盒子。