CODEWITHSUNDEEP
htmlcss
Hayukii_
Hayukii_

Reputation: 79

How to make the line like this?

How can I make a line like below, thank you

enter image description here

Upvotes: 1

Views: 58

Answers (2)

Ramin Rezaei
Ramin Rezaei

Reputation: 170

I always use this code to make ‍‍‍steps. I hope it helps you

<div class="box">
   <div class="item" >  A  </div>

   <div class="line"></div>

   <div class="item" >  B  </div>

   <div class="line"></div>

   <div class="item" >  C  </div>
</div>

.box {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
.item {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.line {
  width: 50px;
  height: 1px;
  background-color: #ccc;
}

Upvotes: 2

Manmeet Singh
Manmeet Singh

Reputation: 1

use hr/ tag it means horizontal line you can adjust the width and height or make is stylish using css

Upvotes: 0

Related Questions