如何使两列排在顶部

【问题标题】：How to make two columns line up to top如何使两列排在顶部
【发布时间】：2017-07-06 00:15:35
【问题描述】：

不知道为什么会发生这种情况，但是当我缩小页面时，我的右栏（黄色栏）会向下移动。当我全屏但不确定如何处理 CSS 以确保列内容始终与 div 容器的顶部对齐时，它看起来很好。这是我的那个部分的css

.wrapper-cols {
margin-top:0px;
margin-left: auto;
margin-right:auto;
max-width: 900px;
}

.contact-col1 {
margin-top:0px;
padding-right:5px;
background-color:blue;
 height: 200px;
}

.contact-col2 {
padding-left:5px;
background-color:yellow;
height: 200px;
}

这是网址：

link

【问题讨论】：

标签： css multiple-columns

【解决方案1】：

导致这种情况发生的样式与您与我们共享的代码没有任何关系。样式表的组合会影响您网站中的所有内容：

Wordpress 包含它自己的 CSS。
您使用的 Beaver Builder Wordpress Page Builder 包含它自己的 CSS。
您使用的 Wordpress 主题（Avada 和 Fusion）都包含自己的 CSS。
Bootstrap 也混入其中。

因此，您已经将所有这些巨大的 CSS 库组合在一起，并且您使用的 HTML 清楚地使用了它们的类。在这一点上，让网站看起来完全符合您的期望的唯一实用方法是自己编写 HTML 和 CSS 代码（而不是使用生成器）。

不实用的方法？花几个小时重置所有涉及的 HTML 标记的样式，用 !important 覆盖它们以使其行为默认。请注意，这涉及使用一些高级 CSS 概念来反对您所包含的库（可能更容易从头开始编写代码）。

【讨论】：