Specifying text size less than 10px and using transform: scale in Chrome

In web design and front-end development, display differences in certain browsers are a common problem. In particular, there is a known problem with the Chrome browser, where text size specified as less than 10px is actually displayed as 10px.

One way to deal with this problem is to use CSS transform: scale(). This property allows the element to be displayed scaled up or down.

Example usage:

.small-text { 
 font-size: 10px; 
 transform: scale(0.8); 
}

In the above example, after specifying a font size of 10px, transform : scale( 0.8) can be used to reduce the size of the text to 80% of that size.

However, since transform: scale() may affect the layout with other elements, careful testing is required when applying it.