Foros del Web » Creando para Internet » CSS »

Problema CSS position absolute fieldeset en Opera

Estas en el tema de Problema CSS position absolute fieldeset en Opera en el foro de CSS en Foros del Web. Hola estoy haciendo un formulario de contacto con una flechita que esta con position absolute y me funciona perfectamente en firefox, chrome, safari y en ...
  #1 (permalink)  
Antiguo 26/11/2010, 09:26
 
Fecha de Ingreso: septiembre-2010
Mensajes: 14
Antigüedad: 7 años, 2 meses
Puntos: 6
Problema CSS position absolute fieldeset en Opera

Hola estoy haciendo un formulario de contacto con una flechita que esta con position absolute y me funciona perfectamente en firefox, chrome, safari y en ie9 pero en Opera es otra historia les dejo mi codigo:

el HTML
Código HTML:
<!DOCTYPE html>
<html>
<head>
<title>Contactanos</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="contenedor">
	<form method="POST" action="enviar.php">
	<fieldset>
		<span class="flechita" style=""></span>
		<legend>Contactanos</legend>
		<label for="nombre">Nombre <span>&rarr;</span> <input type="text" name="nombre"></label>
		<label for="email">Email <span>&rarr;</span> <input type="text" name="email"></label>
		<label for="asunto">Asunto <span>&rarr;</span> <input type="text" name="asunto"></label>
		<textarea name="mensaje" rows="5"></textarea>
		<input type="submit" value="Enviar"><input type="reset" value="Cancelar">
	</fieldset>
	</form>
</div>
</body>
</html> 

y el CSS:

Código HTML:
*{
margin:0;
padding:0;
outline:0;
font:14px Helvetica, Arial, sans-serif;
}
#contenedor{
margin:25px auto 0;
width:450px;
}
form{
position:relative;
}
legend{
color:#BABABA;
font-size:24px;
background-color:#FFFFFF;
border:1px solid #E8E8E8;
padding:5px 15px;
}
fieldset{
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
background:none repeat scroll 0 0 #F9F9F9;
border:1px solid #E8E8E8;
padding:25px;
}
fieldset label{
display:block;
color:#878787;
font-size:16px;
margin-bottom:25px;
}
fieldset label span{
color:#D2414B;
margin-left:10px;
}
fieldset input[type="text"]{
float:right;
width:55%;
}
fieldset textarea{
width:97%;
margin-bottom:25px;
}
input, textarea{
padding:5px;
color:gray;
-moz-border-radius:3px 3px 3px 3px;
-webkit-border-radius:3px 3px 3px 3px;
border-radius:3px 3px 3px 3px;
border:1px solid #EAEAEA;
padding:5px;
background-color:white;
}
input:focus, textarea:focus{
-moz-box-shadow:0 0 5px #A9CAFF;
-webkit-box-shadow:0 0 5px #A9CAFF;
box-shadow:0 0 5px #A9CAFF;
border:1px solid #A9CAFF;
}
input[type="reset"]{
float:right;
}
input[type="submit"], input[type="reset"]{
background:none repeat scroll 0 0 #474747;
color:#EDEDED;
padding:8px 25px;
}
.flechita{
border-bottom:20px solid #EBEBEB;
border-left:10px solid transparent;
height:0;
left:16px;
line-height:0;
position:absolute;
top:0;
width:0;
}
Lo tengo subido a mi host por si lo quieren ver en vivo

http://www.creativehacks.com/demo/contactenos/

El problema solo lo van a ver en Opera.

Etiquetas: opera, position
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:10.