html - 如何将 div 中的文本放置在图像旁边？

Question

我正在尝试构建 Ebay 注册表单。最重要的是，我想将登录文本移到 Ebay pic 旁边的右侧，尝试了浮动和文本对齐，但没有一个是有效的

HTML

<div class="top1">
  <img src="pic/eb.png"/>
  <P id="sigin">Already a member?<a href="https://signin.ebay.com">Sign in</a></P>
</div>

CSS

.top1{
  height: 25%;
  width: 100;
}

#sigin{
  float:right;
  text-align: right;
  font-weight:bold;
  font-size:18px;
}

标签： htmlcssfrontend

Answer 1

像这样试试

<div class="top1">
 <img src="pic/eb.png"/>
 <p id="sigin">Already a member?
  <a href="https://signin.ebay.com">Sign in</a>
 </p>
</div>

CSS：

.top1 {
  height: 25%;
  width: 100;
  display: flex;
}

#sigin {
 margin-right: 10px;
}