时间戳

首页 > 解决方案 > 将 2 个段落彼此相邻对齐

html - 将 2 个段落彼此相邻对齐

问题描述

我需要并排对齐 2 个段落，这样我就可以让所有信息占用更少的垂直空间。

我需要一列占据整个页面宽度的 25% 左右，以便两列占据页面宽度的 50% 左右。

提前致谢

标签： htmlalignment

解决方案

您可以使用flexboxCSS modal 来控制内容流

.flex-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 50%;
}
.flex-wrapper .item {
    flex: 0 0 auto;
    width: 50%;
}
<div class="flex-wrapper">
    <p class="flex-item">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Exercitationem quia cumque aspernatur ut modi suscipit. Sunt natus reiciendis, quisquam enim iste facere incidunt voluptate voluptates amet, minus cupiditate molestiae provident.
    </p>
    <p class="flex-item">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Exercitationem quia cumque aspernatur ut modi suscipit. Sunt natus reiciendis, quisquam enim iste facere incidunt voluptate voluptates amet, minus cupiditate molestiae provident.
    </p>
</div>

推荐阅读