在CSS中无法将两个部分彼此相邻

时间:2020-04-05 15:18:46

标签: html css

因此,我正在为FCC进行Tribute Page挑战赛,但是如果没有不必要的空间,我无法正确地将两个部分彼此相邻。我试过float:left / right;以及display:inline(-block);。我正在尝试将两个部分的文本都放在同一高度上(请参阅所附的屏幕截图)。任何见解或帮助将不胜感激。

Screenshot Tribute Page

#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.”</p>
      </section>
    
          </section>

1 个答案:

答案 0 :(得分:-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.”</p>
  </section>

</section>

相关问题