Question

我有一个p和span标签，我想将它们放在一行中，任何人都可以帮我解决这个问题吗？

这就是我的代码的外观：

＆＃13;

#h3 {
  padding: 0;
  margin: 0;
  width: 268px;
  margin-left: 116px;
  font-size: 18px;
  color: #369;
  font-weight: bold;
}

#heart {
  color: grey;
  font-size: 15px;
  margin-left: 210px;
}

.close {
  font-size: 18px;
  margin-left: 26px;
  padding: 0px;
}

＆＃13;

<p id="h3">
  thiss is me
</p>
<span><i class="fa fa-heart" id="heart"></i><span class="close">x</span></span>
<!--i have a heart icon -->

＆＃13;

我想将所有这些设置在一行中，但在我的代码中，当我尝试在p标记中添加更多详细信息时，所有其他#heart和.close都会沿着这条路走下去。

任何人都可以提供帮助，因此无论这些内容是heart和close保留在最高点，他们的位置都不会改变。

Answer 1

希望这能解决你的问题。谢谢你。

#h3 {
  padding: 0;
  margin: 0;
  width: 268px;
  margin-left: 116px;
  font-size: 18px;
  color: #369;
  font-weight: bold;
 display: flex; 
flex-direction: row;

}

#heart {
  color: grey;
  font-size: 15px;
   
   
}

.close {
  font-size: 18px;
 
  padding: 10px;
}

<p id="h3">
  this is me .Check this out .What I have done.This answer solved my problem <span><i class="fa fa-heart" id="heart"></i><span class="close">x</span>
</p>
   
<!--i have a heart icon -->

如何将p tag和span标记放在一行

1 个答案: