html - 无法在 CSS 中让两个部分彼此相邻

Question

所以，我正在为 FCC 进行 Tribute Page 挑战，但如果没有不必要的空间，我无法正确地将两个部分彼此相邻。我试过浮动：左/右；以及显示：内联（-block）；。我正在尝试将两个部分的文本放在同一高度（请参阅随附的屏幕截图）。任何见解或帮助将不胜感激。

截图致敬页面

#p-1 {
  background: #DFAA00;
  margin-right: 70%;
  margin-left: 30px;
  float: left;
  padding: 0px 20px;
}

#p-2 {
  background: #DFAA00;
  margin-right: 30px;
  margin-left: 35%;
  padding: 0px 20px;
}

  <section id="tribute-info">
    
    <section id="p-1">
    <h3>Cassius Clay or Muhammad Ali?</h3>
      <p> Muhammad Ali is a name familiar to most, but has not always been. Born as Cassius Marcellus Clay, young Cassius soon got into boxing and won the 1960's Olympic Games six years after his amateur debut. Winning the Olympics propelled him into professional boxing. Four years later, Cassius squared off against the reigning Heavyweight champion and defeated him against all odds making him the youngest boxer ever to take the title from a reigning heavyweight champion. Having followed the Nation of Islam for a while, Cassius Clay changed his name into Cassius X which became Muhammad Ali after converting to Islam. </p>
    </section>
    
    <section id="p-2">
    <h3> The Statement that Shaped his Legacy </h3>
      <p> On April 28, 1967, Ali stood up for his beliefs by refusing to step forward during his scheduled induction into the US armed forces for the Vietnam War. This action cost Ali his 'prime' boxing years but engraved his name in the history books. To quote Ali:</p>
        <p id="quote">
        “Why should they ask me to put on a uniform and go 10,000 miles from home and drop bombs and bullets on Brown people in Vietnam while so-called Negro people in Louisville are treated like dogs and denied simple human rights? No I’m not going 10,000 miles from home to help murder and burn another poor nation simply to continue the domination of white slave masters of the darker people the world over. This is the day when such evils must come to an end. I have been warned that to take such a stand would cost me millions of dollars. But I have said it once and I will say it again. The real enemy of my people is here. I will not disgrace my religion, my people or myself by becoming a tool to enslave those who are fighting for their own justice, freedom and equality. If I thought the war was going to bring freedom and equality to 22 million of my people they wouldn’t have to draft me, I’d join tomorrow. I have nothing to lose by standing up for my beliefs. So I’ll go to jail, so what? We’ve been in jail for 400 years.”&lt;/p>
      </section>
    
          </section>

标签： htmlcss

Answer 1

使用 flex 代替：

#tribute-info {
  display: flex;
  flex-direction: row;
  width: 100%;
}

#p-1 {
  background: #DFAA00;
  width: 40%; /* Define your own width for left */
  margin: 10px;
}

#p-2 {
  background: #DFAA00;
  width: 50%; /* Define your own width for right */
  margin: 10px;
}

<section id="tribute-info">

  <section id="p-1">
    <h3>Cassius Clay or Muhammad Ali?</h3>
    <p> Muhammad Ali is a name familiar to most, but has not always been. Born as Cassius Marcellus Clay, young Cassius soon got into boxing and won the 1960's Olympic Games six years after his amateur debut. Winning the Olympics propelled him into professional
      boxing. Four years later, Cassius squared off against the reigning Heavyweight champion and defeated him against all odds making him the youngest boxer ever to take the title from a reigning heavyweight champion. Having followed the Nation of Islam
      for a while, Cassius Clay changed his name into Cassius X which became Muhammad Ali after converting to Islam. </p>
  </section>

  <section id="p-2">
    <h3> The Statement that Shaped his Legacy </h3>
    <p> On April 28, 1967, Ali stood up for his beliefs by refusing to step forward during his scheduled induction into the US armed forces for the Vietnam War. This action cost Ali his 'prime' boxing years but engraved his name in the history books. To quote
      Ali:</p>
    <p id="quote">
      “Why should they ask me to put on a uniform and go 10,000 miles from home and drop bombs and bullets on Brown people in Vietnam while so-called Negro people in Louisville are treated like dogs and denied simple human rights? No I’m not going 10,000 miles
      from home to help murder and burn another poor nation simply to continue the domination of white slave masters of the darker people the world over. This is the day when such evils must come to an end. I have been warned that to take such a stand
      would cost me millions of dollars. But I have said it once and I will say it again. The real enemy of my people is here. I will not disgrace my religion, my people or myself by becoming a tool to enslave those who are fighting for their own justice,
      freedom and equality. If I thought the war was going to bring freedom and equality to 22 million of my people they wouldn’t have to draft me, I’d join tomorrow. I have nothing to lose by standing up for my beliefs. So I’ll go to jail, so what? We’ve
      been in jail for 400 years.”&lt;/p>
  </section>

</section>