nerdcereal.com

I’ve invented a new HTML tag called the <ispan>. It behaves exactly like a <span>, it just won’t inherit any CSS that’s applied to a span.

At my job, our interactive advertising formats dynamically manipulate our publishers’ pages and add content. The trouble with this is that we have no idea the CSS that the publisher uses and our content can erroneously inherit some of the publishers’ styles. Moreover we can’t edit their CSS. The worse CSS rule I’ve come across is this: img {height:50px; width:50px;}

There’s two strategies to avoid this. 1) On every single tag you add to the document, you must set an inline style to override any possible inheritance. (There are at least 10+ common styles to account for.) 2) Make every element (except for images and iframes) an ispan element and odds are the publisher has no styles set for an ispan.

There are two catches: 1) You must create the <ispan> with the createElement method (you cannot use innerHTML or document.write). 2) I thought this was invincible to any CSS a crappy coder could create, but it’s still suceptible to any styles applied to the selector ‘*’.

So, if you’re dealing with javascript and unknown CSS, simply create your own tag. You can call it whatever you want: <whateveryouwant>