从div中删除所有填充

Question

我目前正在使用响应式双列布局。问题是我可以调整div的左侧和右侧的填充，但不能调整顶部和底部的填充。我已经尝试为html中的每个元素手动设置padding-top，但没有任何工作。

此时我已与它斗争了一个小时，所以我现在正在寻求帮助。代码如下，我还附上了我需要的视觉示例。 （忽略纯文本的丑陋，我不会把它放在网站上，直到我修好它。）

这是CSS。

.TwoColumnRow * {
    box-sizing: border-box;
}

.list_2Column {
    float: left;
    width: 50%;
    padding-right: 10px;
}

.list_2Column ul {
top-padding: 0px;
}

.TwoColumnRow :after {
    content: "";
    display: table;
    clear: both;
    border-collapse: collapse;
}

@media screen and (max-width: 450px) {
    .list_2Column {
        width: 100%;
    }
}

这是HTML。

<h2>What is the Employee Wellness Program?</h2>
<p>Our Employee Wellness Program assists businesses, non-profits, and their employees to navigate workplace and personal challenges through educational and supportive counseling. Our program has a strong mental health component which can stand alone or be used with a company’s existing wellness initiative. Research shows employee wellness services can benefit organizations by:</p>

<div class="TwoColumnRow">
<div class="list_2Column" style="background-color:#ededed">
<ul>
<li>Increasing productivity
<li>Decreasing absenteeism and lost revenue
<li>Improving morale and loyalty
</ul>
  </div>
  <div class="list_2Column" style="background-color:#cccccc">
  <ul>
<li>Teaching new skills
<li>Providing resources and referrals
    </ul>
  </div>
</div>

我需要它看起来像：

目前的情况：

Answer 1

没有像top-margin:0这样的东西。试试这段代码。

.list_2Column ul {
  padding-top: 0px;
  margin-top: 0;
  margin-bottom: 0;
}

Answer 2

.list_2Column ul {
    margin-bottom: 3px;
    margin-top: 3px;
}

如果你想要绝对没有填充

，你可以将其更改为0px

Answer 3

添加 margin-top: 0;和margin-bottom: 0;到：

.list_2Column ul {
  top-padding: 0px;
}