更改 flexbox 中第二个 child 的背景颜色
Change background color of the second child in a flexbox
我想将 flexbox 中第二个 child div 的背景色设置为红色,但我做不到。我只能设置第一个 child 的背景颜色。
.main{
display: flex;
justify-content: center;
flex-flow: row wrap;
}
.left_col{
width: 350px;
background-color: green;
};
.right_col{
width: 350px;
background-color: red;
}
<div class="main">
<div class="left_col">
This is the left column. It should be green.
</div>
<div class="right_col">
This is the right column. It should be red.
</div>
</div>
https://jsfiddle.net/mademoiselletse/e5nhca58/2/
第二个 child 的文本对齐方式也与第一个 child 不同。第一个 child 的文本向左对齐,而第二个 child 的文本向中心对齐。我是 flexbox 的新手。非常感谢您的帮助!
;
在 css 中是不允许的,所以它破坏了样式表。删除它,它将起作用:
.main{
display: flex;
justify-content: center;
flex-flow: row wrap;
}
.left_col{
width: 350px;
background-color: green;
}
.right_col{
width: 350px;
background-color: red;
}
<div class="main">
<div class="left_col">
This is the left column. It should be green.
</div>
<div class="right_col">
This is the right column. It should be red.
</div>
</div>
我想将 flexbox 中第二个 child div 的背景色设置为红色,但我做不到。我只能设置第一个 child 的背景颜色。
.main{
display: flex;
justify-content: center;
flex-flow: row wrap;
}
.left_col{
width: 350px;
background-color: green;
};
.right_col{
width: 350px;
background-color: red;
}
<div class="main">
<div class="left_col">
This is the left column. It should be green.
</div>
<div class="right_col">
This is the right column. It should be red.
</div>
</div>
https://jsfiddle.net/mademoiselletse/e5nhca58/2/
第二个 child 的文本对齐方式也与第一个 child 不同。第一个 child 的文本向左对齐,而第二个 child 的文本向中心对齐。我是 flexbox 的新手。非常感谢您的帮助!
;
在 css 中是不允许的,所以它破坏了样式表。删除它,它将起作用:
.main{
display: flex;
justify-content: center;
flex-flow: row wrap;
}
.left_col{
width: 350px;
background-color: green;
}
.right_col{
width: 350px;
background-color: red;
}
<div class="main">
<div class="left_col">
This is the left column. It should be green.
</div>
<div class="right_col">
This is the right column. It should be red.
</div>
</div>