Fácil,
index.php<!DOCTYPE html>
<link rel="stylesheet" href="efectForm.css" /> <input id="author" name="author" type="text" value="" size="30" aria-required="true">
efectForm.cssbody{ font-family:"Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif; }
#comentarios{ clear:both; padding:10px }
#comentarios #responder{ background:#ddd; border:1px solid #d3d3d3; -moz-border-radius:3px; border-radius:3px; clear:both; color:#444; padding:10px; position:relative; width:478px; }
#comentarios #responder .pNombre{ position:relative; }
#comentarios #responder .pNombre label{ background:#eee; color:#555; display:inline-block; font-size:13px; left:4px; min-width:60px; padding:4px 10px; position:relative; top:40px; z-index:1; -webkit-box-shadow:1px 2px 2px rgba(204,204,204,0.8); -moz-box-shadow:1px 2px 2px rgba(204,204,204,0.8); box-shadow:1px 2px 2px rgba(204,204,204,0.8); }
#comentarios #responder .pNombre .requerido{ color:#bd3500; font-size:22px; font-weight:bold; left:75%; position:absolute; top:45px; z-index:1; }
#comentarios #responder p{ margin:10px 0; }
#comentarios #responder label{ line-height:2.2em; }
#comentarios #responder input[type="text"]{ background:#fff; border:4px solid #eee; position:relative; padding:10px; text-indent:80px; -moz-border-radius:5px; border-radius:5px; -webkit-box-shadow:inset 0 1px 3px rgba(204,204,204,0.95); -moz-box-shadow:inset 0 1px 3px rgba(204,204,204,0.95); box-shadow:inset 0 1px 3px rgba(204,204,204,0.95); }
#comentarios #responder input[type="text"]{ display:block; height:24px; width:75%; }
#comentarios #responder input[type="text"]:focus{ text-indent:0; z-index:1; }
#comentarios #responder p{ font-size:12px; }
Autor
En línea
