Shorthand property for setting all the column-rule-* properties

CSSWeb DevelopmentFront End Technology

The shorthand property for column rule is column-rule property. You can try to run the following code to implement the column-rule property

Example

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <style>
         .demo {
            column-count: 4;
            column-gap: 50px;
            column-rule: 2px dotted orange;
         }
      </style>
   </head>
   <body>
      <div class = "demo">
         This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text.
         This is demo text.
      </div>
   </body>
</html>
raja
Updated on 24-Jun-2020 13:10:49

Advertisements