Home/ Questions/Q 8145599
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T13:42:41+00:00

how we can create a diagonal heading line with pure CSS like mentioned below

  • 0

how we can create a diagonal heading line with pure CSS like mentioned below image :-

enter image description here

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    it seems the most appropriate example (the image you provided before you updated your question is the same):
    http://net.tutsplus.com/tutorials/html-css-techniques/how-to-create-diagonal-lines-with-css/

    HTML

    <a href="#">Rohit AZAD</a>

    CSS

    a {

  padding:10px;
  text-decoration:none;
  color:white;
  height:0;
  line-height:50px;
  display:inline-block;
  font-weight:bold;
  border-right:30px solid transparent;
  border-bottom:30px solid blue;

}

    demo :- http://jsbin.com/uhibub/edit#html,live

    • 0