[Solved] can anyone please how to make pointing corner background? [closed]


i just did not find the appropriate duplicate, but it is a duplicate and deserves to be closed for a better readability of the q/a .

You could probably use gradient backgrounds:

header {
  padding:0em 1em 4em;
  margin:1em;
  background:linear-gradient(to bottom, transparent 2em, rgb(58, 64, 125) 2em)
}
div {background:rgb(238, 123, 45);position:relative;padding:1em ;color:white;}
div:after {
  content:'';
  position:absolute;
  top:100%;
  left:0;
  height:2em;
  width:2em;
  background:linear-gradient(to bottom right, rgb(238, 123, 45) 50%, transparent 50.15%)
}
<header><div>
  <h1>HTML Ipsum Presents</h1>

  <p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em>    Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci,
    sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
  </div>
</header>
 

2

solved can anyone please how to make pointing corner background? [closed]