How to Fix Content Wider Than Screen Issue

Sometimes a singel page ends up to be bigger than the Screen. Google will penalty that kind of pages as not mobile friendly and from the user site its a glitsch to that result in a bad experience.
These kind of page bigger than screen can happen if you change content or a client extend an existing site-on longer pages it can be a hasle to find the ement that hang over the page boarder.
Here a little neet CSS that helps to identify the block or element in seconds. Just add one of the lines in the developer console on the page

body { margin: 30px; }
/* Optional: Add some margin to the body to add space and
see where your offending elements cross the line */

body * { border: 1px solid red; }
/* add a border to all other elements on the page */

body * { outline: 1px solid red; }
/* Alternate: add an outline to all elements on the page. Won’t effect box model */