Home/ Questions/Q 8177043
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T23:24:34+00:00

I wants to make the ordered list like mentioned below image. So how i

  • 0

I wants to make the ordered list like mentioned below image.

So how i can make this ordered list with pure CSS…..

As i will increase the list item boxes numbers should dynamically increase with increased list item boxes.

enter image description here

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Hey Shailender Arora Now you can used Counter properties and do this with pure css

    As like this

    HTML

    <ul>
  <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>


</ul>

    Css

    li {
float:left;
background:#e6e6e6;
  width:100px;
  height:100px;
  list-style-type:none;
  margin:10px;
}

li {
counter-increment:shail;
}

li:after {
  content:counter(shail);
}

    Live demo http://tinkerbin.com/xq0uATYn

    • 0