flexbox 和 bem

[blackChef]

android 4.0 ~ 4.3 的内置浏览器支持 flexbox old syntax，也就是说绝大部分的 flexbox 特性都能使用。何必要使用 display: table-cell 这种 hack。 现在所有的 class 都是 _ 分割的，如何区分连字符和层级关系？

[uxsi]

@blackChef 说的是weui cell的布局吧？因为微信h5一般要兼容Windows Phone和Android 2.3，flex不能支持到。用table-cell布局，倒是有个不能使用ellipsis的问题还没解决。

关于class的这一点，weui的class命名并不是bem，命名规范上采用“模块+应用场景”的方式，没有对连字符和层级做严格区分。

[blackChef]

@uxsi 不一定要是 bem。bem 的变种，其它命名方式都可以。毕竟是开源项目，总得有个代码规范。my_widget_header myWidget_header my-widget_header 要是一个项目里出现这么多写法，看着肯定是折磨。

[ximan]

@uxsi http://ons.me/wp-content/uploads/2014/04/flexbox.html 可以看看这个，兼容你提到的Windows Phone和Android 2.3 我看你也是用的less，可以看这个https://github.com/TVVT/commonless

[BearJ]

补充，用table-cell还可以低成本的实现行内元素的居中（vertical-align: middle）

[bruceCzK]

建议用中划线代替下划线，命名可以参考OOCSS的方式，正好less也可以这么嵌套

[BearJ]

@blackChef 因为团队内约定使用的都是下划线，所以生产出来的组件都是用下划线的。