在 flexbox 项目上忽略宽度 [英] Width ignored on flexbox items

问题描述

http://jsfiddle.net/XW9Se/

我在左侧设置了 width: 200px; <div> 但是如果我用浏览器检查器工具查看它，实际宽度似乎是随机的或者其他的东西.它会根据窗口大小不断变化.

I've set width: 200px; on the left <div> but if I view it with the browser inspector tool it appears that the real width is random or something. It keeps changing depending on the window size.

为什么宽度没有生效?

EDIT:如果我删除 width: 100% 宽度保持固定.但我需要这样 #main div 占用剩余的宽度 :( 有没有办法让侧边栏@固定宽度和另一个 <div> 填充其余部分容器宽度?width: auto; on #main 不起作用..

EDIT: If I remove width: 100% the width stays fixed. But I need that so the #main div takes the remaining width :( Is there any way to have the sidebar @ fixed width and the other <div> fill the rest of the container width? width: auto; on #main doesn't work..

推荐答案

去除 .container 上的宽度 >div 并使用 flex: auto; 在 #main 上:fiddle

Remove the width on .container > div and use flex: auto; on #main: fiddle

#main {
   flex: auto; 
   background: lightblue; 
  -webkit-order: 2;
   order: 2;     
}

这篇关于在 flexbox 项目上忽略宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！