Cambiar de color un textarea con botones

Iniciado por Ori-chan, 29 Septiembre 2013, 20:30 PM

0 Miembros y 1 Visitante están viendo este tema.

Ori-chan

Tengo dos problemas, el primero es que el textarea no cambia de color cuando pulso los botones y no se por que y el segundo es que el textarea como que se sale de el body, y no se como corregirlo sin renunciar a que este de adapte a la anchura de todas las pantallas. (El código para el cambio de color lo he cogido de otro tema del foro)



Código HTML:
Código (html4strict) [Seleccionar]
<!Doctype html>
<html>
<head>
<title>Nueva nota</title>
<link href="cssplantillaaplnot.css"
rel="stylesheet" type="text/css">

<script type="text/javascript">

function fondocolor(color) {document.bgColor = color;}


</script>

</head>



<body>
<div id="noseparaqueusareesto">
<textarea id="teeextareeea" class=estilotextarea></textarea>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
<FORM>
<INPUT TYPE="button" VALUE="Rojo" onClick="fondocolor('RED')">
<INPUT TYPE="button" VALUE="Azul" onClick="fondocolor('BLUE')">
<INPUT TYPE="button" VALUE="naranja" onClick="fondocolor('ORANGE')">
<INPUT TYPE="button" VALUE="Verde" onClick="fondocolor('GREEN')">
<INPUT TYPE="button" VALUE="Negro" onClick="fondocolor('BLACK')">
<INPUT TYPE="button" VALUE="Gris" onClick="fondocolor('GRAY')">
<INPUT TYPE="button" VALUE="amarillo" onClick="fondocolor('YELLOW')">
<INPUT TYPE="button" VALUE="blanco" onClick="fondocolor('WHITE')">
</br>
</br>

<INPUT TYPE="button" VALUE="Rojo" onClick="getElementById('teeextareeea').style.color='red'">
<INPUT TYPE="button" VALUE="Azul" onClick="getElementById('teeextareeea').style.color='blue'">
<INPUT TYPE="button" VALUE="naranja" onClick="getElementById('teeextareeea').style.color='orange'">
<INPUT TYPE="button" VALUE="Verde" onClick="getElementById('teeextareeea').style.color='green'">
<INPUT TYPE="button" VALUE="Negro" onClick="getElementById('teeextareeea').style.color='black'">
<INPUT TYPE="button" VALUE="Gris" onClick="getElementById('teeextareeea').style.color='grey'">
<INPUT TYPE="button" VALUE="amarillo" onClick="getElementById('teeextareeea').style.color='yellow'">
<INPUT TYPE="button" VALUE="blanco" onClick="getElementById('teeextareeea').style.color='white'">

</FORM>

</div>
</body>
</html>





Código CSS:
Código (css) [Seleccionar]
.estilotextarea {
border:dashed 0px #000000;

-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
padding:20px;

font-family: Garamond,verdana; font-size: 18pt;

position: absolute;
    width: 100%;
    height: 150px;
}







Un saludo y gracias por leer


#!drvy

El color si cambia. Asegurante de que lo estas probando bien.

El segundo problema te pasa porque le pones padding:20px y luego le dices que ocupe el 100% de la pantalla. Así, el textarea ocupara el 100% + 20px de lado. Quita padding o reduce el ancho.

Saludos