YouTipHTML DOM Style columnFill Property
-- Learning is not just about technology, but also about dreams!
- Home
- HTML
- JavaScript
- CSS
- Vue
- React
- Python3
- Java
- C
- C++
- C#
- AI
- Go
- SQL
- Linux
- VS Code
- Bootstrap
- Git
- Local Bookmarks
JavaScript Reference Manual
JavaScript Objects
- JavaScript Array Object
- JavaScript Boolean Object
- JavaScript Date Object
- JavaScript Math Object
- JavaScript Number Object
- JavaScript String Object
- JavaScript RegExp Object
- JavaScript Global Properties/Functions
- JavaScript Operators
- JavaScript Error
Browser Objects
DOM Objects
- HTML DOM Document Object
- HTML DOM Element Object
- HTML DOM Attribute Object
- HTML DOM Event Object
- HTML DOM Console Object
- CSSStyleDeclaration Object
- DOM HTMLCollection
HTML Objects
- <a>
- <area>
- <audio>
- <base>
- <blockquote>
- <body>
- <button>
- <canvas>
- <col>
- <colgroup>
- <datalist>
- <del>
- <details>
- <dialog>
- <embed>
- <fieldset>
- <form>
- <iframe>
- <frameset >
- <img>
- <ins>
- <input> - button
- <input> - checkbox
- <input> - color
- <input> - date
- <input> - datetime
- <input> - datetime-local
- <input> - email
- <input> - file
- <input> - hidden
- <input> - image
- <input> - month
- <input> - number
- <input> - range
- <input> - password
- <input> - radio
- <input> - reset
- <input> - search
- <input> - submit
- <input> - text
- <input> - time
- <input> - url
- <input> - week
- <keygen>
- <link>
- <label>
- <legend>
- <li>
- <map>
- <menu>
- <menuItem>
- <meta>
- <meter>
- <object>
- <ol>
- <optgroup>
- <option>
- <param>
- <progress>
- <q>
- <script>
- <select>
- <source>
- <style>
- <table>
- <td>
- <th>
- <tr>
- <textarea>
- <title>
- <time>
- <track>
- <video>
Style columnFill Property
Example
Specify how to fill the columns:
document.getElementById("myDIV").style.columnFill="auto";Definition and Usage
The columnFill property specifies how to fill the columns (whether to balance).
Browser Support
Almost all major browsers do not support the columnFill property.
Syntax
Return the columnFill property:
object.style.columnFillSet the columnFill property:
object.style.columnFill="balance|auto|initial|inherit"Property Values
| Value | Description |
|---|---|
| balance | Default value. Balances the columns. The browser should minimize the difference in column lengths. |
| auto | Fills the columns sequentially, resulting in columns of different lengths. |
| initial | Sets this property to its default value. See initial. |
| inherit | Inherits this property from its parent element. See inherit. |
Technical Details
| Default value: | balance |
|---|---|
| Return value: | A string representing the element's column-fill property. |
| CSS Version: | CSS3 |
Related Articles
CSS3 Tutorial: CSS3 Multiple Columns
CSS Reference Manual: column-fill Property
ByteDance Coding Plan supports Doubao, GLM, DeepSeek, Kimi, MiniMax, and other mainstream large models, officially supplied, stable and reliable. Configuration Guide ¥9.9/month Subscribe Now