Question

抱歉，这有点乏味，这是我第一次出现堆栈溢出。我正在为学校做HTML作业，我们需要在那建立自己的网站。如何在页面右侧放置文章，以使文章旁边没有文章？预先感谢！

这是针对HTML5和CSS3的，使用VS Code构建网站。我尝试将其设置为float: right;，但是它使下面的文章随之弹出。

我拥有的东西：

<article>Some text Some text some text</article>
<article>More text More text More text</article>

像上面所说的，我试图使其浮起，但这并没有达到我希望的那样。唯一产生出我想要的东西的东西，只是文章上的padding-left吨。

我基本上正在尝试使它看起来像这样：

                                    Some text Some text some text along with some text

More text More text More text along with more text

Answer 1

这是一个例子！

.container {
  width: 300px;
}

.left, .right {
  display: flex;
}

.left {
  justify-content: flex-start;
}

.right {
  justify-content: flex-end;
}

<body>
  <div class="container">
    <article class="right">Some text Some text some text</article>
    <article class="left">More text More text More text</article>
  </div>
</body>

如何将<article>对齐到右侧，以使下面的<article>保持在下面，并且可以在该<article>的左侧放置图片？

1 个答案: