我怎样才能并排放置两行[重复]答案

【问题标题】：how can I put two rows side by side [duplicate]我怎样才能并排放置两行[重复]
【发布时间】：2021-05-28 20:46:46
【问题描述】：

我有 2 行，每行 4 列，我希望某个大小范围为 3 行问题是在当前代码中线没有连在一起，怎么解决？

这是 CSS 代码

* {
    box-sizing: border-box;
  }

   .wrapper {
    display: flex;
    flex-wrap: wrap;
    }

   .wrapper > * {
    padding: 1em;
    background-color: grey;
    border: 1px solid black;
    flex: 0 1 25%;
  }

  @media (max-width: 768px) {
   .wrapper>* {
     flex: 0 1 33.33%;
   }
}

<div class='wrapper'>
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
</div>
<div class='wrapper'>
  <div>5</div>
  <div>6</div>
  <div>7</div>
  <div>8</div>
</div>

如何组合 2 个 div 以使它们组合在一起？目前看起来是这样的：

我希望它是这样，上面有 2 个 div

1 2 3 
4 5 6
7 8

【问题讨论】：

使用 Javascript、HTML 或 CSS 时请输入executable scripts。

标签： html css

【解决方案1】：

改变html结构是最简单的方法。

<div class='wrapper'>
 <div>1</div>
 <div>2</div>
 <div>3</div>
 <div>4</div>
 <div>5</div>
 <div>6</div>
 <div>7</div>
 <div>8</div>
</div>
<style type="text/css">
.wrapper .div{ float: left; width: 33.3%; }
</style>

【讨论】：