Question

flex布局怎么设置其中元素的宽度

Answer 1

div实际得宽度＝div宽度＋padding的宽度。想保持一定距离有很多方法：你可以把让现在div的宽度改成减去padding后的宽度，还可以里面欠个div直接设padding。

任何一个容器都可以指定为Flex布局。行内元素也可以使用Flex布局。Webkit内核的浏览器，必须加上-webkit-前缀。
注意，设为Flex布局以后，子元素的float、clear和vertical-align属性将失效。

Answer 2

<div class='father'>
    <div class='child-one'>测试1</div>
    <div class='child-two'>测试2</div>
    <div class='child-three'>测试3</div>
</div>

.father {
    display: flex;
}

/*比如要设置‘测试1’所在‘div’宽度固定为‘300px’*/

.child-two {
    flex-grow: 0;
    flex-shrink: 0;
    width: 300px
}

/*可以理解为：此处设置flex-grow,flex-shrink是告诉flex，既不要给我自动放大，也不要给我自动缩小，我就想设置自己的宽度*/

Answer 3

父元素高度设置为空或者auto即可，如height:auto或者不要height;，举例如下: 1.高度采用auto; 这里是子集内容,子集内容采用的是宽度780px,高度1000px,并且居中对齐； 这是父级内容，宽度为800px,高度自适应

Answer 4

如果是flex-direction: row;则对相应的flex-item设置样式为 flex:0 1 200px就是设置宽度为200px;flex-direction方向的则是设置高度为200px,也可以用%单位；

Answer 5

注意，设为Flex布局以后，子元素的float、clear和vertical-align属性将失效。

但是子元素的宽高，还可以设置啊，使用 width，height，就好了。