CSS Only Input Placeholder

This is a "HTML / CSS Only" Solution to the "CSS Only Input Placeholder" Question floating around the internet, unfortunately this is not a solid solution, and only accounts for the user clicking once on the input field, this was just a test to a question I had seen. If anyone else has any addition they want to make to this that may help push it to a full solution, I would love to hear it.

by childerskc

HTML

<a id="Trickory" href="#OnlyHappensOnce">
    <input type="text" value="" id="email1" class="inputfield_ui" />
    <label>Email address 1</label>
</a>

CSS

html, body {margin:0px}
a#Trickory {color: #CCC;} /* Actual Label Color */
a#Trickory:visited {color: #FFF;} /* Fake "Turn Off" Label */

a#Trickory:visited input {border-color: rgb(238, 238, 238);} /* Make Sure We Dont Mess With The Border Of Our Input */

a#Trickory input:focus + label {display: none;} /* "Turn Off" Label On Focus */

a#Trickory input {
    width:95%;
    z-index:3;
    position:relative;
    background-color:transparent;
}
a#Trickory label {
    position:absolute;
    display:block;
    top:3px;
    left:4px;
    z-index:1;
}