MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

这篇翻译不完整。请帮忙从英语翻译这篇文章

column-width CSS属性建议一个最佳列宽。 列宽是在添加另一列之前列将成为最大宽度。

/* Keyword value */
column-width: auto;

/* Different <length> values */
column-width: 6px;
column-width: 25em;
column-width: 0.3vw;

/* Global values */
column-width: inherit;
column-width: initial;
column-width: unset;

This allows you to achieve scalable designs that fit different screen sizes. Especially in presence of the column-count CSS property which has precedence, to set an exact column width, all length values must be specified. In horizontal text these are width, column-width, column-gap, and column-rule-width.

初始值auto
适用元素non-replaced block elements (except table elements), table-cell or inline-block elements
是否是继承属性
适用媒体visual
计算值the absolute length, zero or larger
Animation typea length
正规顺序the unique non-ambiguous order defined by the formal grammar

语法

Formal syntax: <length> | auto
column-width: auto;

/* Different <length> values */
column-width: 6px;
column-width: 25em;
column-width: 0.3vw;

column-width: inherit;

取值

<length>
Is a <length> value giving a hint of the optimal width of the column. The actual column width may be wider (to fill the available space), or narrower (only if the available space is smaller than the specified column width). The length must be strictly positive or the declaration is invalid.
auto
Is a keyword indicating that the width of the column should be determined by other CSS properties, like column-count.

例子

.content-box {
  border: 10px solid #000000;
  column-width: 300px;
}

规范

Specification Status Comment
CSS Writing Modes Module Level 3
column-width
Candidate Recommendation Adds intrinsic sizes via the keywords min-content, max-content, fill-available and fit-content.
CSS Multi-column Layout Module
column-width
Candidate Recommendation  

浏览器兼容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Yes)-webkit 1.5 (1.8)-moz 10 11.1 3.0 (522)-webkit
Intrinsic sizes 未实现 未实现 未实现 未实现 未实现
on display: table-on, display: table-caption (Yes) 37 (37) (Yes) (Yes) (Yes)
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support (Yes) 1.0 (1.8)-moz (Yes) (Yes) (Yes)
Intrinsic sizes 未实现 未实现 未实现 未实现 未实现
on display: table-on, display: table-caption (Yes) 37.0 (37) (Yes) (Yes) (Yes)

文档标签和贡献者

 此页面的贡献者: xgqfrms-GitHub, Sebastianz, fscholz, FredWe
 最后编辑者: xgqfrms-GitHub,