[SOLUCIONADO] formato de formulario

edurocc · #1 (**permalink**) 26/05/2015, 23:02

Hola, tengo un formulario que baje de internet y tiene un formato el formulario que no me gusta. Esta todo bien, salvo unos recuadros que tiene, intente quitarselo pero no lo logre, comente todo lo que decia border, y quite algunos, pero me queda creo que el ultimo una linea simple y blanca que no logro descubrir como ponerla en color del fondo para que no se vea o color transparente.
esta compuesto por un html, un css, un java script
pidanme lo que crean necesario.
gracias.

nota: el css lo revise y estoy practicamente seguro que no esta alli.

lauser · #2 (**permalink**) 27/05/2015, 03:20

Como lo vamos a ver si no pones el código?

NueveReinas · #3 (**permalink**) 27/05/2015, 04:04

Cita:

Iniciado por edurocc

nota: el css lo revise y estoy practicamente seguro que no esta alli.

Pero es que nosotros no podemos verlo

edurocc · #4 (**permalink**) 28/05/2015, 09:19

bueno pongo el html

<head>
<title>Formulario de Contacto</title>
<link rel="shortcut icon" type="image/x-icon" href="../../imágenes/fabicon.ico" />
<link rel="stylesheet" href="estilos.css" />

</head>

<body>
<form method="post" class="contacto">
<div><label>
<blockquote>
<img src="http://www.forosdelweb.com/f53/img/copia.jpg" ><br /><p align="center"><strong></strong></p>
</blockquote>
</label>
</div>
<fieldset>
<div><label>Nombre:</label><input type="text" class="nombre" name="nombre" /></div>
<div><label>Email:</label><input type="text" class="email" name="email" /></div>
<div><label>Telefono:</label><input type="text" class="telefono" name="email" /></div>
<div><label>Mensaje:</label><textarea cols="30" rows="5" class="mensaje" name="mensaje" ></textarea></div>
<div class="ultimo">
<img src="ajax.gif" class="ajaxgif hide" />
<div class="msg"></div>
<button class="boton_envio">Enviar Mensaje</button>
</div>
</fieldset>
</form>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="funciones.js"></script>
</body>

hay una imagen ahi arriba que esta direcc a forosdel web que se puso sola, ja.
abajo pongo el css

edurocc · #5 (**permalink**) 28/05/2015, 09:28

Este es ek css,
Veran algunas cosas comentadas, que son para quitar el marco que tenia, y como dije en la consulta solo me falta quitar un recuadro, es el recuadro externo q no logro ver dnd esta.

/* color: #798e94; */
color: #FFFFFF;
font: 12px sans-serif;
}
body {
/*background-image:url(../../imag/background.gif);*/
}
/* Estilos del formulario */
form.contacto {
/* border: 1px solid #CED5D7;
border-radius: 6px;*/
margin: 25px auto 0;
width: 440px;
background-color: ;
/* box-shadow: 0px 5px 10px #EEF5F7 inset;*/
}
form.contacto fieldset {
background: ;
border: 1px solid #E1E1E1;
box-shadow: 0 0 10px #DADADA;
-webkit-box-shadow: 0 0 10px #DADADA;
-moz-box-shadow: 0 0 10px #DADADA;
padding: 25px;
}
form.contacto fieldset > div {
clear: both;
margin-bottom: 20px;
overflow: hidden;
}
form.contacto fieldset div label {
display: block;
font-weight: bold;
float: left;
margin-right: 15px;
margin-top: 5px;
text-align: right;
text-transform: uppercase;
width: 84px;
}
form.contacto input[type="text"], form.contacto textarea {
background: #F5F5F5;
/* border: 1px solid #E8E8E8;*/
color: #626262;
display: block;
float: left;
padding: 8px;
resize: none;
width: 350px;
-webkit-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
}
form.contacto input[type="text"]:focus, form.contacto textarea:focus {
background: #F9F9F9;
border: 1px solid #D3D3D3;
outline: none;
}
form.contacto .ultimo{
margin-bottom: 0;
position: relative
}
form.contacto button {
background: #798e94;;
border: 0 none;
color: #FFFFFF;
float: right;
font-weight: bold;
height: 32px;
padding: 0 10px;
position: relative;
text-transform: uppercase;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
}
form.contacto button:hover{
background: #6A6A6A;
}

/* AJAX Gif y mensajes de exito o fracaso */
.hide{
display: none;
}
.ajaxgif{
position: absolute;
right: 150px;
top: 5px;
}
.msg{
color: white;
font-weight: bold;
height: 32px;
line-height: 32px;
padding: 0 10px;
position: absolute;
right: -155px;
text-transform: uppercase;
min-width: 121px;
}
.msg_ok{
background: #589D05;
}
.msg_error{
background: red;
}
/*a continuacion medidas y para que se vea en el centro el logo de la empresa*/
/*.contacto div label blockquote blockquote p {
text-align: right;
}sobra*/
/*div label blockquote blockquote p img {
text-align: center;
}sobra*/
.contacto div blockquote {
text-align: center;
}

NueveReinas · #6 (**permalink**) 03/06/2015, 08:04

Lo he copiado aquí: http://jsfiddle.net/ddwxh6cb/

Y no termino de comprender el problema. ¿Podrías detallarlo gráficamente/visualmente?

baldaweb · #7 (**permalink**) 03/06/2015, 08:31

Si quieres quitar el borde del formulario es la etiqueta fieldset, dale estilos al fieldset para que te quite los bordes.

Pero no se muy bien que es lo que quieres.

edurocc · #8 (**permalink**) 05/06/2015, 08:07

aqui les dejo la imagen
<iframe width="480" height="360" src="http://s1185.photobucket.com/user/elbuda/embed/slideshow/Apuntes"></iframe>

http://s1185.photobucket.com/user/el...deshow/Apuntes

http://s1185.photobucket.com/user/el...deshow/Apuntes

edurocc · #9 (**permalink**) 05/06/2015, 08:13

Cita:

Iniciado por NueveReinas

Lo he copiado aquí: http://jsfiddle.net/ddwxh6cb/

Y no termino de comprender el problema. ¿Podrías detallarlo gráficamente/visualmente?

ahi coloque la imagen para que puedas ver.
otra pregunta, el link ese que me dejaste como funciona esa pagina? me interesa. es pago? gracias.

edurocc · #10 (**permalink**) 05/06/2015, 08:19

Cita:

Iniciado por baldaweb

Si quieres quitar el borde del formulario es la etiqueta fieldset, dale estilos al fieldset para que te quite los bordes.

Pero no se muy bien que es lo que quieres.

Exactamente que pongo.
Gracias.

NueveReinas · #11 (**permalink**) 06/06/2015, 09:54

Sigo sin entender el problema.

JSFiddle es gratuito.

AngelKrak · #12 (**permalink**) 06/06/2015, 10:40

ese borde que quiere quitar se hace asi amigo ;)

Busca form.contacto fieldset y donde dice border: 1px solid #E1E1E1; cambialo por Transparent border: transparent; y quitale las sombras box-shadow: 0 0 10px #DADADA;
-webkit-box-shadow: 0 0 10px #DADADA;
-moz-box-shadow: 0 0 10px #DADADA;

y listo me imagino que era lo que querias quitarle >_<

http://jsfiddle.net/ddwxh6cb/1/

edurocc · #13 (**permalink**) 06/06/2015, 21:15

Cita:

Iniciado por AngelKrak

ese borde que quiere quitar se hace asi amigo ;)

Busca form.contacto fieldset y donde dice border: 1px solid #E1E1E1; cambialo por Transparent border: transparent; y quitale las sombras box-shadow: 0 0 10px #DADADA;
-webkit-box-shadow: 0 0 10px #DADADA;
-moz-box-shadow: 0 0 10px #DADADA;

y listo me imagino que era lo que querias quitarle >_<

http://jsfiddle.net/ddwxh6cb/1/

Si Si, ese es el borde !!!

La sombra se fue pero aun queda una linea fuerte fina y blanca.
en el css pongo transparent pero no me aparece como opcion al escribirlo, igual lo escribi talcual me lo recomendo, asique no estoy seguro si me lo esta tomando.
Estoy usando dreamwaver 8
alguna recomendacion?
Gracias

edurocc · #14 (**permalink**) 06/06/2015, 22:09

Consegui quitarle el borde y como va sobre fondo negro puse fondo negro en vez de transparente, puse borde 0px en vez de transparente y no solo habia que modificar la etiqueta fieldset tambien el form general.
Tome el css original y solo modifique lo siguiente:
form.contacto {
border: 0px solid #CED5D7;
/* border-radius: 6px;*/
margin: 25px auto 0;
width: 440px;
background-color:#000000;
/* box-shadow: 0px 5px 10px #EEF5F7 inset;*/
}
form.contacto fieldset {
/* background: white;*/
border: 0px solid #E1E1E1;
/* box-shadow: 0 0 10px #DADADA;
-webkit-box-shadow: 0 0 10px #DADADA;
-moz-box-shadow: 0 0 10px #DADADA;*/
padding: 25px;
}
Gracias a todos y en especial a AngelKrak que entendio lo que yo necesitaba.
Tema solucionado