Customer Street CSS

Long has it been a problem for developers developing sites for browsers that do not support standards in their HTML and CSS. Creating a site that is accessible, clean and well coded is a problem with this respect because of the fact that some browser bugs can only be gotten round by either using ‘hacks’, or by creating a lot of excess code that really shouldn’t need to be there. But that is the crisis the developers face everyday.

Another tool that I have found extremely useful recently is called XRAY. This awesome small peice of script is so basic and easy to use there is no reason why you shouldn’t have it available for your site. And the best thing is it works across ALL browsers (that I’ve tried it with so far, with the exception of Multiple IE browsers).

How do I Get It?

All you have to do to get the script is visit the above link and copy, or drag the shown link to your favourites bar. Then, whichever page you are looking at you can use the script on simply by clicking on the link in the favourites bar of any browser. And how does it work? I hear you say. I believe the script is basically javascript and all it does is inspect the element that you click on (much like Firebug for Firefox) giving you plenty of details about it’s name, it’s hierarchy in the document and some of the styles that have been applied to it.

Another good portion of this script is that it highlights the area you are ‘inspecting’ very clearly and even shows the margin and padding applied to the area in different colours. I have found this so very useful for debugging sites in IE where extra margins and padding seem to be applied all the time! Gone are the days where you simply couldn’t see where the problem laid… with this tool you can almost certainly find and correct the problem with ease!

3.5

after 4 Votes