How to add triangle in table cell

Question

I need to add up-right triangle in a cell.

How to do this?

I t

Answer 1

To do cell text inside div it good idea. but if you just put extra div for ARROW not for text. because it creates problem when td has given width and height and text stays on TOP with padding-top:20px;.

I found another solution and tested on All major browsers (eg: IF and FF as well)

.arrow-right-1 {
  position: absolute;
  top: -1px;
  right: -5px;
  float: right;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid red;
  transform: rotate(45deg);
}

td {
  border: solid 1px blue;
  width: 160px;
  height: 100px;
  /* padding: 0px !important; */
  /* vertical-align: top; */
  position: relative;
}

  

    

      

        
you can increase or decrease the size of td's height or can put more text