/Html/How to make the dashed border with longer dashes css

How to make the dashed border with longer dashes css

Border dashed spacing

<!-- dashed border spacing -->
<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8" />
      <meta http-equiv="X-UA-Compatible" content="IE=edge" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <title>Border Spacing</title>
      <style>
         div.two {
            border: 2px dashed #ff0000;
         }

         div.five:before {
            content: '';
            position: absolute;
            border: 5px dashed #ff0000;
            top: -3px;
            bottom: -3px;
            left: -3px;
            right: -3px;
         }

         div.ten:before {
            content: '';
            position: absolute;
            border: 10px dashed #ff0000;
            top: -8px;
            bottom: -8px;
            left: -8px;
            right: -8px;
         }

         div.odd:before {
            left: 0;
            right: 0;
            border-radius: 60px;
         }

         div {
            overflow: hidden;
            position: relative;

            text-align: center;
            padding: 10px;
            margin-bottom: 20px;
         }
      </style>
   </head>

   <body>
      <div class="two">Kupo nuts here</div>
      <div class="five">Kupo nuts<br />here</div>
      <div class="ten">Kupo<br />nuts<br />here</div>
      <div class="ten odd">Kupo<br />nuts<br />here</div>
   </body>
</html>

Source: stackoverflow.com

Similar codes

30 votes175 views1 answer
Fork me on github html css code
Html
153 votes184 views6 answers
Open new tab html
Html
87 votes178 views6 answers
Href tag in html
Html
0 vote191 views2 answers
Vertical line navigation bar
Html
30 votes194 views1 answer
Fork me on github html template
Html
49 votes188 views4 answers
Html start code
Html
0 vote192 views1 answer
How to spread links from not right next to each other html
Html
0 vote186 views10 answers
Include html
Html
0 vote189 views1 answer
Html download video link
Html
0 vote171 views1 answer
Flask base models
Html