CSS3 box-lines Property

Example

Specify that a div box is allowed to expand to multiple lines:

div
{
display:box;
box-orient:horizontal;
box-lines:multiple;
width:200px;
}

Try it yourself »

Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

The box-lines property is not supported in any of the major browsers.

Firefox supports an alternative, the -moz-box-lines property?

Safari and Chrome support an alternative, the -webkit-box-lines property?


Definition and Usage

The box-lines property specifies whether columns will go onto a new line whenever it runs out of space in the parent box.

Tip: By default, a horizontal box will lay out its children in a single row, and a vertical box will lay out its children in a single column.

Default value: single
Inherited: no
Version: CSS3
JavaScript syntax: object.style.boxLines="multiple"


Syntax

box-lines: single|multiple;

Value Description
single All child elements will be placed in a single row or column (elements that do not fit will simply be considered overflow)
multiple The box is allowed to expand to multiple lines, to accommodate all of its children