He creado una hoja de estilos css3, con un reset css3 para los navegadores y poner mi estilo. Luego dentro de ese mismo documento he creado una clase para dar forma y tamaño a las cajas de input type text.
El problema es que al darles forma y tamaño a las cajas les sale una sombra interior que no he establecido ni quiero.
Este es el código del css, al principio está el reset para navegadores, al final está la clase para el input type text
Código CSS:
Ver original@charset "utf-8";
/* CSS Document */
/*
ANULA TODO EL CSS3 POR DEFECTO DE LOS NAVEGADORES
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
<em>/* No olvides definir estilos para focus */</em>
:focus {
outline: 0;
}
<em>/* No olvides resaltar de alguna manera el texto insertado/borrado */</em>
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
<em>/* En el código HTML es necesario añadir cellspacing="0" */</em>
table {
border-collapse: collapse;
border-spacing: 0;
}
/*
DA FORMA Y TAMAÑO A LOS INPUT TYPE TEXT DE LOGIN
*/
input.texto{
width:109px;
height:9px;
box-shadow:none; /* SE SUPONE QUE SUPRIME TODA SOMBRA, PERO NO LO HACE*/
border-top-left-radius:10px;
border-top-right-radius:10px;
border-bottom-left-radius:10px;
border-bottom-right-radius:10px;
}
esta es la imagen del resultado con ese código
¿Alguien sabe cómo solucionarlo?
Gracias!!