下拉菜单不调整大小

Question

我正在使用弹性网格，其中行和列具有属性display:flex。 现在我正在创建一个下拉列表。使用属性display:inline-flex。但它延伸到全宽。属性inline-flex 不起作用。 我无法删除包装器属性

.wrapper { 
   display:flex; 
   flex-direction: column; 
   flex-grow: 0; 
   flex-shrink: 0; 
}

演示：http://codepen.io/JEETPAL/pen/wzkopX

Answer 1

所以我在您的代码中更改了以下内容：

1. 将align-self: flex-start 添加到dropdown 以不扩展整个宽度（这是align-items 或align-self 的默认值是stretch）

2. 将 dropdown 的 min-width 从 100 像素更改为 180 像素，以匹配 ul 的像素

   .dropdown{
     align-self: flex-start;
     min-width:180px;
   }
   

更新代码笔：http://codepen.io/anon/pen/jrRJVg