CSS style debugging trick with Dev tools

January 24, 2019 | By kiranbadi1991 | Filed in: Browser, Development.

One of the very old  trick for debugging CSS styles for an element is apply selector(*) which applies to all elements of the page and then give it an outline property with some solid borders.

We do something like below in chrome dev tools


Once you apply this property to the page, it looks something like below.


So we now know exactly which element style to adjust so that it does not overflow the view port.

Technorati Tags: ,

Comments are closed here.