In order to access this site you need to enable JavaScript!

You are here: Reference > CSS > properties > browser specific extensions > -moz-column-rule-width

-moz-column-rule-width property | -webkit-column-rule-width property

Browser support:

-moz-column-rule-width:

	3.5

-webkit-column-rule-width:

Specifies the width of the column rule, which is placed in the middle of the column gap.

Note: The -moz-column-rule-width property is supported in Firefox from version 3.5.

JavaScript page for this property: MozColumnRuleWidth | webkitColumnRuleWidth. You can find other example(s) there.

Possible values:

One of the following values:

border width in non-negative length

The width of the border in length units. For the supported length units, see the length page.

inherit

Takes the value of this property from the computed style of the parent element.

medium

Default.

thick

Greater than the medium width.

thin

Less than the medium width.

Default: medium.

Example HTML code 1:

This example illustrates the use of the -moz-column-rule-width and -webkit-column-rule-width properties:

<head>
    <style>
        #container { 
            -moz-column-count: 4;
            -moz-column-width: 90px;
            -moz-column-rule-width : 3px;
            -moz-column-rule-style : solid;
            -moz-column-rule-color : black;

            -webkit-column-count: 4;
            -webkit-column-width: 90px;
            -webkit-column-rule-width : 3px;
            -webkit-column-rule-style : solid;
            -webkit-column-rule-color : black;
        } 
    </style>
</head>
<body>
    <div id="container">
        This is the contents of the 1. column.<br />
        This is the contents of the 2. column.<br />
        This is the contents of the 3. column.<br />
        This is the contents of the 4. column.<br />
    </div>
</body>