¿La altura y el ancho no se aplican al tramo?
Pregunta total de novato, pero aquí.
CSS
.product__specfield_8_arrow {
/*background-image:url(../../upload/orng_bg_arrow.png);
background-repeat:no-repeat;*/
background-color:#fc0;
width:50px !important;
height:33px !important;
border: 1px solid #dddddd;
border-left:none;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-bottom-left-radius:0px;
border-top-left-radius:0px;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-topleft:0px;
-webkit-border-bottom-left-radius:0px;
-webkit-border-top-left-radius:0px;
margin:0;
padding:2px;
cursor:pointer;
}
HTML
<span class="product__specfield_8_arrow"> </span>
Violín
Básicamente, estoy tratando de emular un botón, hacer que un intervalo (o algo así) parezca un botón al lado de un campo de entrada que en realidad no necesita serlo debido a un generador de autocompletar que genera errores al ingresar. Pensé que esto sería una solución rápida por ahora, pero obviamente no.
Gracias.
Span es un elemento en línea. No tiene ancho ni alto.
Puede convertirlo en un elemento a nivel de bloque y luego aceptará sus directivas de dimensión.
span.product__specfield_8_arrow
{
display: inline-block; /* or block */
}
Mar 22 '2010 09:03
Intente usar a diven lugar de spano usar CSS display: block;o display: inline-block;- spanes por defecto un elemento en línea que no puede tomar propiedades widthy height.
Inspirándome en @Hamed, agregué lo siguiente y funcionó para mí:
display: inline-block; overflow: hidden;
Span toma ancho y alto solo cuando lo convertimos en elemento de bloque.
span {display:block;}
Según el comentario de @Paul, si se especifica display: block, span deja de ser un elemento en línea y un elemento después de que aparece en la siguiente línea.
Vine aquí para encontrar una solución a mi problema de altura del tramo y obtuve mi propia solución.
Agregarlo overflow:hidden;y mantenerlo en línea resolverá el problema que se acaba de probar en el modo IE8 Quirks
