10.18.2011

html5doctor: 'Eric Meyer invented CSS Reset, Paul Irish invented Bulletproof, but I...


HTML5 Doctor

Helping you implement HTML5 today

eric meyer invented the reset, p
Dogmeat_and_eric_meyer_invented_css_dont_forget_howcome_have_you_seen_it
aul irish invented @font-face bulletproof (and i'm sorry for saying 'fuck you' to him...but that mountain of code is bullshit and you know it, BUT i invented the most ridiculous (but ultimately useful--inspired by being unfortunate enough to blog on 'NoCSSterous: The Blog that strips everything') process for going 'back to the future' and taking valid html5 + CSS, running it through premailer's genius app and then cramming up the Internet
Dogmeat_and_tbl_invented_the_internet_have_you_seen_it
like some caveman in a spaceship (Posterous's fault, not mine!)--of course, the great thing about it --an unintended side-effect/happy accident--is that I realized by doing this insane process multiple times a day (so that posts look like posts for Posterous), that one is now able to see exactly (and in no other way have i ever seen it demonstrated so consistently--and i've read W3  cover to cover) what one's stylesheet is doing as far as cascade, inheritance and plain old 'wtf did it do that for' bizarre application which not even an Eric Meyer

Tantek Çelik

, David Barron, Fantasai picnic
Cimg0022_111010
could explain. ...anyway, I did yours just because I was reading it earlier and thought you'd like to see it. --i was too tired to mark up this comment form, be happy with the q's
here's how your <body> rendered     body style="font-variant: normal; font-weight: normal; font-size: 16px; margin: 0 0 0 120px; background-color: #f0f0f0; line-height: normal; font-family: Georgia, serif; padding: 0; border: 0; font-style: normal; outline: 0; color: #444; overflow-y: scroll; vertical-align: baseline; width: 720px;"    this is your main p, or at least your first couple:    p style="font-variant: normal; font-weight: normal; font-size: normal; margin: 1.5em 0; line-height: normal; font-style: normal; border: 0; padding: 0; outline: 0; vertical-align: baseline;"  these look like the majority of your a's:   a href="http://www.georgehernandez.com/h/xComputers/CharacterSets/Shortcuts.asp" title="Shortcuts by George Hernandez" style="outline: 0; border-bottom-style: solid; text-decoration: none; color: inherit; background-color: rgb(249, 253, 162); line-height: normal; font-variant: normal; margin: 0; font-size: normal; font-weight: normal; padding: 0; border-bottom-color: #ddd; border-width: 0 0 1px; vertical-align: baseline; font-style: normal;"More   'code'  was by far the biggest group  pre style="font-variant: normal; font-weight: normal; font-size: 0.9375em; margin: 1.5em 0; background-color: #eee; line-height: normal; font-family: 'andale mono', 'lucida console', monospace; outline: 0; white-space: pre-wrap; border: 1px dotted #666; padding: 18px 0 18px 40px; vertical-align: baseline; font-style: normal;"    code style="white-space: pre-wrap; outline: 0; font-size: 0.875em; margin: 0; background-color: #fff; line-height: 1.42857; font-family: 'DejaVu Sans Mono', Consolas, impact, monospace; font-weight: normal; font-variant: normal; border: 0; color: #000; padding: 0; vertical-align: baseline; font-style: normal;"   i couldn't figure out where all the spans came from after  each code...there seemed to be an inordinate quantity...could have been something the validator didn't like and replaced, like it did/does with almost every HTML5 Element that is not perfect (have you ever tried to get figure past the validator?  fucking nightmare), or it could have been from your blog editor...  span style="outline: 0; line-height: normal; font-size: normal; margin: 0; font-weight: normal; padding: 0; font-variant: normal; border: 0; font-style: normal; font-family: impact; vertical-align: baseline; br   kbd style="white-space: pre-wrap; outline: 0; font-size: 0.875em; margin: 0; background-color: #fff; line-height: 1.42857; font-family: 'Deja Vu Sans Mono',  Consolas, monospace;  font-weight: normal;  font-variant: normal;  border: 1px solid #ddd; color: #000; padding: 1px 2px; vertical-align: baseline; font-style: normal;   here's a  blockquote + p :   blockquote style="font-variant: normal; position: relative; font-weight: normal; font-size: 16px; margin: 1.5em 0 1.5em -1.5em; background-color: #fff; line-height: 19px; font-family: Baskerville, Georgia, serif; outline: 0; border: 1px solid #777; color: #666; padding: 0.75em; vertical-align: baseline; font-style: normal;    p style="font-variant: normal; font-weight: normal; font-size: normal; margin: 1.5em 0; line-height: normal; font-style: normal; border: 0; padding: 0; outline: 0; vertical-align: baseline;"   The cite element represents the title of a work    and here's the  cite + a  combo platter:  cite style="outline: 0; line-height: normal; font-size: normal; margin: 0; font-weight: normal; padding: 0; font-variant: normal; border: 0; font-style: normal; font-family: impact; vertical-align: baseline;"  a href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-cite-element" title="4.6 Text-level semantics — HTML5" style="outline: 0; border-bottom-style: solid; text-decoration: none; color: inherit; background-color: rgb(249, 253, 162); line-height: normal; font-variant: normal; margin: 0; font-size: normal; font-weight: normal; padding: 0; border-bottom-color: #ddd; border-width: 0 0 1px; vertical-align: baseline; font-style: normal;"W3C HTML5 specification    here's a nice q which i had to manually reinsert because as you probably know the CSS validator strips more characters than a Bourbon Street whore:    q style="font-variant: normal; quotes: '\201C' '\201D' '\2018' '\2019'; font-weight: normal; font-size: normal; margin: 0; line-height: normal; outline: 0; border: 0; padding: 0; vertical-align: baseline; font-style: italic;"A piece of work     h3 style="font-variant: normal; font-weight: bold; font-size: 1.25em; margin: 1.8em 0 0.6em; line-height: 1.2; font-family: 'Quicksand', 'Helvetica Neue', Arial, sans-serif; outline: 0; border: 0; padding: 0; vertical-align: baseline; font-style: normal;"...Get ex    this is how your 'self' links rendered:    a href="#7c3b6d16fb0116f8b6ac74824437d750" style="outline: 0; border-bottom-style: solid; text-decoration: none; color: inherit; background-color: rgb(249, 253, 162); line-height: normal; font-variant: normal; margin: 0; font-size: normal; font-weight: normal; padding: 0; border-bottom-color: #ddd; border-width: 0 0 1px; vertical-align: baseline; font-style: normal;"     h2 style="font-variant: small-caps; font-weight: normal; font-size: 19px; margin: 1.5833em 0 0.6667em; line-height: 38px; font-family: Georgia, serif; font-style: normal; border: 0; padding: 0; outline: 0; vertical-align: baseline; letter-spacing: 1px;"together now     these are the last few, i think (as you can imagine, it was one of the longest inline conversions imaginable with the code    ol style="font-variant: normal; font-weight: normal; font-size: normal; margin: 0.5em 0 1.5em; line-height: normal; font-style: normal; border: 0; padding: 0; outline: 0; vertical-align: baseline;"   li style="outline: 0; line-height: normal; font-size: normal; margin: 0; font-weight: normal; padding: 0; font-variant: normal; border: 0; font-style: normal; font-family: impact; vertical-align: baseline;    strong style="outline: 0; line-height: normal; font-size: normal; margin: 0; font-weight: normal; padding: 0; font-variant: normal; border: 0; font-style: normal; font-family: impact; vertical-align: baseline;"2011-06-29   i'll probably do a post of this and link to everything and everyone, but just thought i'd give you something to ponder first...i really hope this is your stylesheet because I also did one of the contributing author Oli Studholme's blog, but I thought i'd be polite and give you yours...since you're the host and all
sincsserely,
Dogmeat_hardrock_from_fontspace
dogmeat

HTML5 Doctor Helping you implement HTML5 today eric meyer invented the reset , p aul irish invented @font-face bulletproof (and i'm sorry for saying 'fuck you' to him...but that mountain of code is bullshit and you know it, BUT i invented the most ridiculous (but ultimately useful--inspired by being ...» more Dogmeat