flex方向行和对齐内容: flex-start不起作用
在云计算领域，弹性布局（flex）是一种用于网页设计和开发的CSS属性，用于控制元素在容器中的排列方式和对齐方式。在这里，我们将重点讨论flex布局中的flex-direction和对齐内容方面。
Flex布局提供了四个主要的flex-direction属性值，分别为row（默认值）、row-reverse、column、column-reverse。这些值可以用于指定元素在容器中的排列方向。
- row：元素按照水平方向从左往右排列。
- row-reverse：元素按照水平方向从右往左排列。
- column：元素按照垂直方向从上往下排列。
- column-reverse：元素按照垂直方向从下往上排列。
对于flex-start属性，它用于指定元素在主轴上的对齐方式为起始位置。在flex-direction为row时，元素在主轴上从容器的左侧开始排列；在flex-direction为column时，元素在主轴上从容器的顶部开始排列。
然而，当flex-start对齐方式不起作用时，可能是由于其他因素导致的。以下是一些常见的原因和解决方法：
- 父容器没有设置display属性为flex或inline-flex：在使用flex布局时，父容器需要设置display属性为flex或inline-flex才能生效。
- 父容器没有设置宽度或高度：当父容器没有固定的宽度或高度时，元素可能无法正常对齐。确保父容器有足够的空间来容纳元素。
- 子元素有自身的宽度或高度：子元素如果设置了具体的宽度或高度，可能会影响到元素的对齐方式。可以尝试将子元素的宽度或高度设置为auto。
- 子元素被包裹在其他容器中：在某些情况下，子元素可能被包裹在其他容器中，导致flex-start对齐方式不起作用。检查并确保子元素直接位于父容器中。
如果以上解决方法都无效，可能是由于其他CSS属性或样式冲突导致的。可以检查并调整相关的CSS属性，或提供更多的代码和上下文信息以便更好地理解问题。
推荐的腾讯云相关产品和产品介绍链接地址：
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云CDN：https://cloud.tencent.com/product/cdn
- 腾讯云弹性MapReduce：https://cloud.tencent.com/product/emr
- 人工智能开放平台：https://cloud.tencent.com/product/tencentaip
- 云存储COS：https://cloud.tencent.com/product/cos
相关·内容
1回答
在我的项目中，我有两个专栏，每一列都有自己的垫-手风琴，其中有一些垫-扩展板。
当我单击打开任何一个扩展面板时，它将相反的列向下移动。
这是CSS。基本上，“行”持有两列，其中包含手风琴。
.row {
padding-top: 120px;
padding-left: 25px;
padding-right: 25px;
flex-flow: row wrap;
box-sizing: border-box;
display: flex;
justify-content: space-between;
ali
浏览 1提问于2020-10-27得票数 0
回答已采纳
2回答
嵌套柔性盒和项对齐
、、、
我正在尝试创建基于CSS3柔性显示的自己的小网格系统。我基本上有以下课程：
一个grid类，它是一个flex容器，其flex方向设置为列。
一个row类，它是一个flex容器，其flex方向设置为row。
不同柔性基大小的column类的集合。
我想要的是能够通过设置row元素的self-align属性将每一行对齐到左/中/右。然而，每当我尝试去做的时候，事情似乎就变糟了。
这里是一个演示它的柱塞：
HTML
<!-- first row -->
<div class="row align-end"> <!-- try
浏览 4提问于2015-04-24得票数 2
回答已采纳
我正在使用VS2015和C#开发一个WPF应用程序。
在该应用程序中，我有一个函数，它用NReco PdfGenerator将HTML转换为PDF。
在我的PDF中，我得到了一些标签，其中的文本可以水平和垂直对齐。
水平对齐不是问题，我做了体育课。与“文本对齐:中心”内容是水平中心。
但是现在我的客户也想要在标签上垂直对齐，所以我用柔性盒解决了对齐问题。
每一个例子：
"display: flex; justify-content: center; align-items: center;"
这意味着标签的文本将以水平和垂直方向居中。
不幸的是，NReco PdfGenerat
浏览 1提问于2018-04-23得票数 0
回答已采纳
1回答
到目前为止，我已经为justify-content编写了类和修饰符，如下所示：
.flex {
display: flex;
$positions: (
start: flex-start,
end: flex-end,
center: center,
around: space-around,
between: space-between
);
@each $mod, $dir in $positions {
&--just-#{$mod} {
justify-content: $dir;
}
}
}
浏览 4提问于2017-10-19得票数 0
回答已采纳
1回答
是什么导致了flex容器行之间的空格？
我已经删除了到dev project的链接，因为答案是不言而喻的，第一行的一个项目设置了非常高的高度。
两者之间的差距很大
*)上面一行包含div.hlang、div.headerstamp.stampcont、div.pckHeader、svg#coatArmCyprus
*)和较低的一行，包含三个内容不同的div.pck (长列)。
造成这种差距的原因是什么？因为我在body.cont中对齐了所有这些项，flex容器与flex-direction: row；justify-content: flex-start；align-content: flex
浏览 0提问于2017-09-19得票数 0
我正在尝试使用flex来对齐同一行上的按钮:按钮"Back“应该在左边，按钮"Continue”应该在右边(行的末尾)。
.footer {
display: flex;
}
.back {
align-content: flex-start;
}
.continue {
align-content: flex-end;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<
浏览 0提问于2018-03-16得票数 3
回答已采纳
在Vaadin13中，我想在html样式中对TextArea的标签使用flex-direction，但它不起作用 textArea1.addClassName("my-text-area1");
textArea2.addClassName("my-text-area2"); <dom-module theme-for="vaadin-text-area" id="style-for-text-area1">
<template>
<style>
浏览 11提问于2019-03-24得票数 0
回答已采纳
2回答
是否可以使用display: flex;将所有项对齐到左边(flex-wrap: wrap; align-items: flex-start; justify-content: flex-start;)，但是容器它自己对中心(如margin: 0 auto;)？
似乎挠性容器总是缩放到100%的宽度，为什么自动边距不能工作。有谁知道如何实现我所尝试的吗？
.container {
width: auto;
margin: 0 auto;
display: -webkit-flex;
display: -moz-flex;
display: -ms-fle
浏览 1提问于2015-11-17得票数 2
回答已采纳
我能够将所有子元素对齐为flex-start，如下所示：
.parent{
display:flex;
align-content:flex-start;
}
但是，我有一个子元素，一个一次性的元素，我希望它能够作为一个flex-end创建，但是这样做是行不通的：
#child2{
align-self:flex-end;
}
为什么child2不和flex-end对齐？
浏览 0提问于2016-04-12得票数 3
回答已采纳
我使用作为布局，在完成之后，我尝试获得以下对齐方式：
我的想法如下：
框(<div>)需要在列中流动：flex-direction: column;
它们是对齐的自顶向下的：align-content: flex-start;。
底部有一个特定的框：align-self: flex-end;
这将导致下面的HTML代码(也可以在上找到)
<div class="container">
<div class="box1">
box 1
</div>
<div c
浏览 6提问于2015-12-07得票数 6
回答已采纳
我是CSS Grid的新手，在Google搜索之后，我没有找到我想要的东西，我想知道我的属性是否对齐，请告诉我，flex-start/flex end和start/end值之间有什么区别？
浏览 1提问于2018-07-25得票数 5
回答已采纳
我有一个行方向的flexbox嵌套在一个列方向的flexbox中，但是当我想在子目录中使用align-content时，它不能工作。
当我用display:block替换父对象的display:flex时，它可以工作。
在下面的代码中，我们可以看到.row align-content: flex-end;无法工作。但是，如果我将.column display: flex;替换为display: block;，则align-content: flex-end;可以工作。
请问有没有可能解决这个问题？
body {
background-color: grey;
}
.column
浏览 0提问于2016-05-14得票数 22
4回答
我这里有代码，但基本上问题是我有这些产品卡，我试图让他们在中心，但也对齐他们与其他卡，如果这是有意义的。
这是我想要实现的目标与实际发生的情况的对比图。它最初看起来很好，直到您尝试调整它的大小。
我已经尝试使鸡尾酒容器具有值flex-start，而不是中心属性，如下所示
#cocktails-container {
max-width: 70%;
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
}
但是当我调整它的大小时，这会在右边留下很多空格。我尝试过使用inline-block和文本对齐，但
浏览 1提问于2020-09-01得票数 0
我正在尝试通过使用topLeft对齐justifyContent: 'flex-start'的缩略图。但这不管用。下面是我的密码。
<Content>
<View key = {index} style={styles.commentBody}>
<List>
<ListItem avatar>
<View style={{ justifyContent: 'flex-start'}}>
<Left>
<Thumbnail
浏览 1提问于2017-09-09得票数 0
回答已采纳
在使用flex align-*属性时，flex-start和baseline有什么不同
下面的代码片段为align-self: flex-start和align-self: baseline提供了相同的输出。
在哪些情况下，align-self: flex-start和align-self: baseline的行为会有所不同？
.flex-container {
color: white;
display: -webkit-flex;
display: flex;
width: 350px;
height: 200px;
background-color: yell
浏览 2提问于2016-01-05得票数 68
回答已采纳
1回答
对挠性项目应用边距
、、、
因此，我从堆栈溢出中获得了这三个列布局示例，但我尝试使用flexbox同时获取列和行。
我的最终目标是有一个三列布局(左边是图片，两列在右边是文本)。
但是，我需要所有的东西都是对齐的(文本和图像在同一个轴上对齐)。
但我的问题是，当我尝试使用margin-bottom在列中分隔元素时，只有文本列一正在工作(而不是图像列)，而我不知道为什么。
我希望左列margin-bottom也能工作。但是，即使我为所有列添加了margin-bottom，只有那些带有div的列才能工作。
我应该把我的图像也放在电视里吗？
下面是我面临的问题的一张图片：
* {
margin: 0;
}
h
浏览 2提问于2016-07-18得票数 1
回答已采纳
2回答
我想将第二列中的内容对齐，如下所示：
目前，它看起来是这样的：
我相信这与我的flex-grow，flex-shrink和flex-basis有关。但我不确定。这是JSFiddle。
.work-meta-row{
display: flex;
flex-direction: row;
align-items: flex-start;
align-self: flex-start;
justify-content: flex-start;
line-height: 22px;
flex-wrap: nowrap;
.work-meta-label{
浏览 0提问于2018-09-20得票数 2
1回答
没有正确对齐的挠性盒
、、、
我有一个<div>中的内容，它具有现在的have属性。我使用flex框对齐内容的垂直和水平，以成为中心。
因为我正在使用<div>属性和固定宽度，所以我的内容在容器之外溢出，这两个方向都是x和y。我知道它会发生，因为它所使用的财产。
我的意图是，如果内容太长，无法被容器保存，则应该保持对齐而不是中心对齐，并且只能在Y方向溢出。
我想要解决方案而不添加额外的DOM。有可能。
div{
width:330px;
margin:0 auto;
height:50px;
border:1px solid #a7a7a7;
text-align:cente
浏览 3提问于2016-10-06得票数 1
回答已采纳
我正试着在一个有一定高度的容器里放一些东西放在下面。然后，如果没有剩余空间，项目将彼此并排进行。
这就是我们的想法：
我正在尝试使用flexbox来实现这一点，这是一个具有设置高度的容器，方向设置为column，而flex-wrap设置为wrap
问题是列之间有很大的差距。
我尝试将justify-content和align-items都设置为flex-start，但这可能是默认值。
有什么办法可以解决这个问题吗？
代码如下：
* {
box-sizing: border-box;
}
body {
font-family: sans-serif;
}
.con
浏览 1提问于2016-11-30得票数 56
回答已采纳
5回答
当使用flex创建图像网格时，我如何在页面上水平地对网格进行居中？我仍然希望图像在每一行上左对齐。我希望它对每一行的元素数是动态的。
.gallery {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-content: flex-start;
align-items: flex-start;
}
.gallery-artwork {
width: 400px;
display: flex;
margin: 10px;
}
浏览 0提问于2016-02-09得票数 7
回答已采纳
1回答
在我的应用程序的移动版本中，我有以下标题布局项。应用程序徽标，“登录”文本，用户名和注销按钮。我想要的是
徽标应位于标题的左上角。
登录: admin应该出现在同一行上，并右对齐
在它们下面，注销按钮也应该对齐到右边。
我正在使用vaadin，这允许我编写css，在这里，我决定我可以用弹性显示器来完成这个任务，但是我无法让它工作，我如何实现它呢？
我当前的css如下所示：
/* On screens that are 600px or less, set the background color to olive */
@media screen and (max
浏览 4提问于2020-11-30得票数 1
回答已采纳
我使用Material-UI列表项(https://material-ui.com/components/lists/) 我想要“左对齐”我的列表项中的项到左边。显然，我可以使用flex属性"flex-start“来实现这一点，我可以在ListItem的alignItems属性上设置该属性，如下所示： <List>
<ListItem alignItems="flex-start">
<ListItemText primary={"First Element "} />
<L
浏览 20提问于2021-09-02得票数 0
.row {
background: green;
color: white;
margin-top: 20px;
}
.col2 {
border: 3px solid black;
display: flex;
flex-direction: column;
flex-wrap: wrap;
align-content: flex-end;
} <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/boots
浏览 7提问于2019-05-02得票数 0
回答已采纳
当我设置flex-direction: column和align-items:flex-start(或除默认值(称为“拉伸”)之外的任何值)时，哪个自动分配的align-items:flex-start属性控制flex项的宽度？
我知道flex-basis在设置flex-direction:column时控制高度(因为主轴是自上而下的)。但我真的想知道，在这种情况下，它控制那个弹性项的“宽度”是什么？
浏览 1提问于2020-08-28得票数 2
回答已采纳
我可以对齐网格磁贴的内容，但我只想让它影响网格内部的表格。
我有这个：
.mat-grid-tile .mat-figure {
justify-content: flex-start !important ;
align-items: flex-start !important;
}
编辑:上面这段css来自之前的解决方案：
在styles.css中，但显然它会影响磁贴内部的所有内容，但我只想让它影响我的mat-table。有没有办法让情况不是这样呢？
<mat-grid-list id="parentGrid" cols="4" rowHe
浏览 1提问于2019-07-26得票数 0
2回答
我试过这个：
<html>
<head>
<title>Left, Mid, Right action buttons</title>
<style>
.parent {
width: 600px;
background-color: yellow;
}
.itemleft {
display: flex;
justify-content: flex-start;
}
.itemcenter {
display: flex;
justify-content: center;
}
.itemright {
d
浏览 4提问于2017-08-14得票数 4
回答已采纳
1回答
我有这个列表ol，其项目li如下所示：
ol {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
width: 400px;
}
li {
width: 120px;
height: 120px;
}
正如您可以看到的，3项适合在一行。因为我使用的是justify-content: space-between，第一行看上去与我想要的完全一样。但是，第二行没有(因为它只有两个项)。我希望它们的位置就像有第6元素一样(在它们之间没有间隔和左对齐)。
浏览 2提问于2014-10-28得票数 0
回答已采纳
下面是使用sectionList在行中显示事件名称的RN (0.59)组件。renderItem在一行中呈现3个项，从头图像(左图像)开始，然后是事件名，以另一个头图像(右图像)结尾。
render() {
return (
<View style={styles.container}>
<SectionList
sections={this.state.activeEvents}
renderItem={({item, section}) => {return
浏览 0提问于2019-06-17得票数 3
回答已采纳
2回答
我希望div在头部下面对齐。我好像不能让它工作。(见代码和照片)。
我的Html：
<td>
<div class="schedule-content">
<div class="timestamp">
<h3>00:00 - 00:00</h3>
<ul>
<li>Name1</li>
浏览 0提问于2020-05-28得票数 0
3回答
我试图在将项目保留在列中的同时对齐它们，但是，当我将项放在列中时，它默认为重新对齐页面上的项。
我现在拥有的是：
<div className='postHeader'>
<div>{post.title}</div>
<div>{post.author}</div>
</div>
CSS
.postHeader {
padding-top: 60px;
padding-left: 25px;
display: flex;
justify-content: flex-star
浏览 2提问于2017-09-18得票数 2
图像中的元素是使用绝对定位的样式，但是当我调整屏幕大小时，我必须稍微调整“待售”元素和“400,000美元”元素的定位，所以我想知道是否有一种方法可以使用柔性盒实现相同的布局？
这是我的尝试()
<div class = 'container'>
<p class='item1'>Top Left</p>
<p class='item2'>Bottom Right</p>
</div>
css：
.container{
display: flex;
浏览 13提问于2022-06-08得票数 0
回答已采纳
我不能让东西左右对齐的卡片标题通过CSS。在我的卡片标题中，我想把md-icon delete_forever放在右边。我尝试了flex，但不起作用。
<div class="flex-container">
<div *ngFor="let item of items | async" class="flex-items-default">
<md-card (click)="test()" style="width:300px;height:250px"
浏览 2提问于2017-01-08得票数 1
在不使用列方向的情况下，我试图获得弹性项来填充剩余的垂直空间。没有列似乎是不可能的？
<div class="flex-container">
<div class="flex-item" style="height:100px">100PX</div>
<div class="flex-item stretch-v">
Should stretch vertically
</div>
</div>
CSS
.flex-container
浏览 0提问于2019-01-11得票数 0
1回答
听我说，gitHub
、、、、
我正在用GitHub设计我的个人资料，我在Readme.md中遇到了一些困难。
<div display=flex; align-items=flex-start; flex-direction=row;>
<p align="center" > <img src="https://www.codewars.com/users/yefimchuk/badges/large" alt="https://www.codewars.com/users/yefimchuk" />
<p align
浏览 11提问于2022-03-13得票数 3
回答已采纳
2回答
在柔性盒中以图像为中心
、、、
我正在制作一个网页，需要将3 div作为宣传内容对齐，如下所示：
为了得到这个间隔和对齐，我添加了不可见的图像，然后隐藏在手机上，所以它们得到响应，就像这样：
<div id="promocontent">
<img class="img-responsive" src="img/iconenope.png">
<img class="img-responsive hidden hide-on-med-and-down" src="img/iconehidden.png
浏览 0提问于2016-10-18得票数 1
回答已采纳
我试图创建一个布局，以便当我单击“查看更多”来展开一个容器的文本时，周围的容器保持在相同的位置。
有三个容器，每个容器有两个包装器，顶部包含标题，底部包含图像、文本和按钮。我不知道标题的长度会是多少，所以为了确保框、文本和按钮排列起来，我已经给出了每个容器的对齐--内容:空格--以便底部包装始终对齐。
单击“查看更多”后会出现问题，每个容器的底部包装向下移动以适应容器的高度。
.main-container {
display: flex;
flex-direction: row;
}
.container
浏览 2提问于2021-03-29得票数 3
2回答
我有4个项目，需要包装在css使用flex。一行3项，然后是一项。
.movies {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items:flex-start;
flex: 1 0 33%;
}
我不能(不允许)使用方向栏。
无论我做什么，我总是在一行中结束，在那里我需要侧滚动。
浏览 7提问于2022-04-08得票数 0
回答已采纳
1回答
在flex容器中，我有不同大小的项目，我想在几个不同宽度的列中显示，这取决于内容。flex-flow: column wrap在固定容器高度方面对我有好处，但是我对容器有固定的宽度，并且根据内容需要高度。我想要足够宽的柱子。例如，它的外观必须：
.container {
height: 80px;
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-flow: column wrap;
align-c
浏览 0提问于2017-07-29得票数 7
回答已采纳
2回答
我的main View下有两个视图
<View style={styles.container}>
<View style={styles.header}>
<Image
resizeMode="contain"
source={require("../assets/logo-large.png")}
style={styles.logo}
/>
</View>
<View
浏览 0提问于2020-09-22得票数 0
2回答
我的表格中有一些水平设置的复选框。它们是动态设置的，因此数量可以更改。我使用了flex，并使用flex包装允许复选框转到下一行。以下是html：
.form-group {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.wrap {
min-width: 12em;
max-width: 12em;
}
<div [hidden]="hidden">
{{label}}
<div class="form-group pl-4 mb-
浏览 9提问于2022-03-25得票数 1
回答已采纳
我正在使用flexbox，并尝试制作6个这样的东西：
到目前为止，这是我的代码：
<section class="focus-item">
<div class="item focus-item-1">
<h4>Brand </h4>
<p>Identity
aliquam ipsum ante morbi sed ipsum mollis.
Sollicitudin viverra, vel varius ege
浏览 1提问于2015-09-27得票数 2
2回答
在这种情况下，如何简单地更改flex框中的对齐文本？
我试图使文本与flex-start对齐，但有些地方出了问题，我不明白是什么。我认为主样式不会改变，或者在这种情况下，我需要使用其他的东西，而不是align-items。我需要将所有文本(md-card-title、md-card-subtitle、md-card-content)与flex-start对齐。
goods.component.css
md-card {
display: flex;
flex-direction: column;
justify-content: space-around;
align-item
浏览 3提问于2017-10-06得票数 1
回答已采纳
4回答
因此，我想对齐项目在弹性框内，如在上面的图片。
我有以下html：
<div class="flex-row">
<div class="flex-item">
<img src="/default.png">
</div>
<div class="flex-item">
<img src="/default.png">
</div>
<div class="flex-it
浏览 3提问于2019-05-27得票数 0
回答已采纳
1回答
我有一个具有行方向的父Flex容器(.content-flexbox-row)，在这个容器中，我正在创建另一个具有列方向(3列)的flex。
第一列我有3个项目，第二列我有1个项目，第三列我有2个项目。
我在这里面临的问题是第二列和第三列在第一列的基础上占据中心位置。
我希望第2列和第3列数据从头开始，而不是从中心开始。
.content-flexbox-row {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
width: 60%;
margin: 0 auto;
border-bottom: 1px
浏览 3提问于2017-04-12得票数 1
我正在使用flex框对齐两个项目的左和右的容器，而垂直中心对齐他们。这里有一个非常简单的例子，说明我正在努力实现的目标。
HTML：
<div class="container">
<div class="first"></div>
<div class="second"></div>
</div>
CSS：
.container {
width:100%;
display: flex;
flex-direction: row;
浏览 0提问于2014-11-17得票数 12
回答已采纳
1回答
我有两个问题：
为什么我的flexWrap不能工作？当文本长度超过父文件时，我的文本不会换行开始新行。
我真的不想将flex值1.5设置为alertCardItem，我希望flex能够根据警告消息的长度进行调整。我怎样才能做到这一点？我试过将flex设置为0，但不起作用
见这里的图像
我尝试使用npm包react本机-轻松-网格：
<CardItem style={{borderBottomLeftRadius: 10, borderBottomRightRadius: 10, backgroundColor: '#fff'}}>
<
浏览 0提问于2018-02-09得票数 0
我的头有一个问题，当我应用flex时，在.container元素上，子flex-justify不起作用，但当我移除它时，我不能将它们居中对齐。
* {
margin: 0;
padding: 0;
text-decoration: none;
color: white;
}
header {
background: inherit;
border-bottom: 1px solid var(--border);
padding: 1rem 0rem;
background: pink;
}
/*
Remove the fl
浏览 4提问于2021-05-22得票数 0
2回答
如何对齐两个挠性盒元素？
、、、
我对柔性箱有个问题。我试图对齐两个元素:一个与容器顶部对齐，另一个与中心对齐。大多数柔性箱示例使用的是三个元素，而不是两个元素。所以我尝试了我自己的解决方案。
#main {
display: flex;
flex: 1;
flex-direction: column;
justify-content: space-between;
height: 100px;
background-color: #dfdfdf;
}
#box1 {
display: flex;
justify-content: flex-end;
background-color:
浏览 4提问于2018-11-22得票数 0
回答已采纳
2回答
我在页面顶部显示了这行项目，但我不太确定如何让它们中的一项显示在最右侧。其余的则左对齐。我尝试过align-self: flex-end，但这不起作用。代码如下：
.wrapper {
display:flex;
justify-content:flex-start;
align-items:flex-start;
}
a.nav, .search, .query {
display:inline-block;
}
.nav {
margin-left:25px;
}
.nav a {
margin-right:15px;
c
浏览 0提问于2020-12-18得票数 1
我有一些盒子使用inline-flex来集中它们的内容。盒子有两行内容，但有些会有三行。盒子有一个明显的宽度和高度。当应用justify-content: center时，带有三行内容的框似乎会向下移动它们的整个容器，我不知道为什么：
这是一支笔：
我怎样才能把这些箱子排好？
谢谢!
@import url("https://fonts.googleapis.com/css?family=Oxygen:300,400");
.box {
align-items: center;
background-color: cadetblue;
color: w
浏览 2提问于2020-07-22得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
