Html 人力资源：利润最高的韩元'；不行。为什么？

我需要在我的

hr

中添加一个

margin top

（可以在Quem Somos部分看到）。我什么都试过了，但都没用。我曾尝试在

div

中添加

hr

，然后将

margintop

应用于该

div

，但效果并不理想。我想使

hr

上方和下方的空间相等

你能帮我吗

现场：

HTML:

<div class="row">
<div class="quem-somos">
  <a id="quem"></a>

  <h1 class="quem-somos-title">QUEM SOMOS?</h1>
  <h1 class="quem-somos-subtitle">VOCÊ COM CERTEZA JÁ OUVIU FALAR DAS FAMOSAS FÓRMULAS DE BHASKARA.</h1>

  <div class="quem-somos-content-1">

A equação completa de segundo grau agora pode ter mais sentido do que nunca. Pelo menos foi assim para a gente. Aprendemos a enxergar resultados claros e perfeitamente desenhados em cada problemática que analisávamos, e assim encontramos o X.
<br />
<br />
Dizem por aí que números não se comunicam.<br />
 Já nós preferimos pensar que eles ajudam na evolução de qualquer negócio e podem se comunicar muito mais do que imaginamos, inclusive nos inspirando criativamente.
  </div>

  <div class="quem-somos-content-2">
  <img src="images/quemsomos1.png" />
  </div>

<hr>


<div class="quem-somos-content-3">
<img src="images/quemsomos3.png" />
</div>

<div class="quem-somos-content-4">
<br />
<br />
<img src="images/quemsomos2.png" />
</div>

</div>
</div>

---

我想你需要用一个容器包装你的quem-somos-content-1和quem-somos-content-2，把你的hr标签放在容器外面。这应该可以解决问题。

这与你的浮动有关。即使清除浮动，元素也不知道其真实大小。试试这个：

<div class="row">
    <div class="quem-somos">
        <a id="quem"></a>

        <h1 class="quem-somos-title">QUEM SOMOS?</h1>
        <h1 class="quem-somos-subtitle">VOCÊ COM CERTEZA JÁ OUVIU FALAR DAS FAMOSAS FÓRMULAS DE BHASKARA.</h1>

        <div class="quem-somos-content-wrapper">
            <div class="quem-somos-content-1">

                A equação completa de segundo grau agora pode ter mais sentido do que nunca. Pelo menos foi assim para a gente. Aprendemos a enxergar resultados claros e perfeitamente desenhados em cada problemática que analisávamos, e assim encontramos o X.
                <br />
                <br />
                Dizem por aí que números não se comunicam.<br />
                Já nós preferimos pensar que eles ajudam na evolução de qualquer negócio e podem se comunicar muito mais do que imaginamos, inclusive nos inspirando criativamente.
            </div>

            <div class="quem-somos-content-2">
                <img src="images/quemsomos1.png" />
            </div>
        </div>

        <hr>


        <div class="quem-somos-content-3">
            <img src="images/quemsomos3.png" />
        </div>

        <div class="quem-somos-content-4">
            <br />
            <br />
            <img src="images/quemsomos2.png" />
        </div>

    </div>
</div>

---

现在，您的页边距应该可以在

最小JSFIDLE/codepen上使用了？它存在于应用了页边距的标记中。只是尝试了一下，但没有起作用。我是否需要更改我的人力资源CSS中的某些内容？请尝试让您的hrIt完美运行。诀窍可能是溢出：隐藏。非常感谢你！

<div class="row">
    <div class="quem-somos">
        <a id="quem"></a>

        <h1 class="quem-somos-title">QUEM SOMOS?</h1>
        <h1 class="quem-somos-subtitle">VOCÊ COM CERTEZA JÁ OUVIU FALAR DAS FAMOSAS FÓRMULAS DE BHASKARA.</h1>

        <div class="quem-somos-content-wrapper">
            <div class="quem-somos-content-1">

                A equação completa de segundo grau agora pode ter mais sentido do que nunca. Pelo menos foi assim para a gente. Aprendemos a enxergar resultados claros e perfeitamente desenhados em cada problemática que analisávamos, e assim encontramos o X.
                <br />
                <br />
                Dizem por aí que números não se comunicam.<br />
                Já nós preferimos pensar que eles ajudam na evolução de qualquer negócio e podem se comunicar muito mais do que imaginamos, inclusive nos inspirando criativamente.
            </div>

            <div class="quem-somos-content-2">
                <img src="images/quemsomos1.png" />
            </div>
        </div>

        <hr>


        <div class="quem-somos-content-3">
            <img src="images/quemsomos3.png" />
        </div>

        <div class="quem-somos-content-4">
            <br />
            <br />
            <img src="images/quemsomos2.png" />
        </div>

    </div>
</div>

quem-somos-content-wrapper{
    overflow: hidden;
}