7 CSS Tricks You Should Know

Disable link

.inactive-link{ 
     color : black; 
     text-decoration : none; 
     pointer-events : none; 
     cursor : default;
}

You can disable any link using CSS, so that no action occurs while clicking on the link.

Disable resizing of textarea

textarea{  
   resize : none;
}

Resize property defines resizing of textarea, in order to disable resizing this can be done.

Change the placeholder color

: : placeholder{  
     color : red;
}

The pseudo element ::placeholder allow you to style your placeholder text.

Unordered list in bullets

ul{ 
    list-style-type : none;
}

The property list-style-type defines the type of list item makers.

Disable text selection

.non-select-element{  
      user-select : none;
}

The property user-select defines wether user can select text of the element or not.

Resize image proportionally

img{  
   max-width : 100%;  
   height : auto;
}

Width can also be used instead of max-width if desired. The key is use height : auto to override any height="..." attribute already present on the image.

Make image fit

img{ 
  width : 100%;
  height : 100%;
  object-fit : contain;
}

Another way is use of object fit property, this will fit image, without changing proportionally.