[SOLUCIONADO] crear pagina pequeña con css

[lushiru]

tengo el siguiente codigo ya listo en html:

Código HTML:

<p>HOLA</p><div class="tool"><table><form action="hola.php" method="post">
<tr><td>nombre</td><td><input type="text" size="20" /></td></tr>
</form></table></div>
 

el codigo css es el siguiente:

Código CSS:

.tool{display:none;}
p:hover+.tool,.tool:hover{display:block;position:absolute;background:#ccc;padding:10px;border-radius:10px;}
 

la cual en html me abre una pequeña pagina el problema es ya cuando quiero ingresar texto al formulario, desaparaece el cuadro ya que no estoy posicionado sobre el texto inicial. como podria lograrlo? saludos.

[C2am]

Una posible solución es meter ese <div> dentro del <p> y por supuesto cambiar ese "+" por un "<"

Código HTML:

<div id="hola">HOLA <div class="tool"><table><form action="hola.php" method="post">
<tr><td>nombre</td><td><input type="text" size="20" /></td></tr>
</form></table></div></div>
 

Código CSS:

.tool{display:none;}
div#hola:hover>.tool{display:block;position:absolute;background:#ccc;padding:10px;border-radius:10px;}
 

<iframe width="100%" height="300" src="http://jsfiddle.net/c2am/mzB8X/1/embedded/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

http://jsfiddle.net/c2am/mzB8X/1/embedded/result/


Ahora, por favor quita esa tabla ya que un input no es un "dato a tabular".

[C2am]

NO REPITAS TEMAS: http://www.forosdelweb.com/f4/crear-...n-css-1073569/
Reporta el tema anterior para que lo unan a este, ya que corresponde a este foro más que donde ya te di una respuesta.

Saludos