将两个竖着排放的div横着排放
时间: 2024-02-17 12:00:33 浏览: 91
要将两个竖着排放的div横着排放,可以使用CSS的flexbox布局。首先,将包含这两个div的父元素的display属性设置为flex,然后设置flex-direction为row,即可实现横向排列。示例代码如下:
HTML代码:
```
<div class="container">
<div class="box1">Box 1</div>
<div class="box2">Box 2</div>
</div>
```
CSS代码:
```
.container {
display: flex;
flex-direction: row;
}
.box1 {
width: 100px;
height: 100px;
background-color: red;
}
.box2 {
width: 100px;
height: 100px;
background-color: blue;
}
```
这样,box1和box2就会横向排列在一行中。
阅读全文