Est-ce que la hauteur et la largeur ne s’appliquent pas à la scope?

Total question noob, mais ici.

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

   

Violon

Essentiellement, j’essaie d’émuler un bouton, de faire en sorte qu’un span ressemble à un bouton à côté d’un champ de saisie qui n’a pas besoin d’être un à cause d’un générateur de remplissage automatique qui génère des erreurs sur Entrée. Je pensais que ce serait une solution rapide pour le moment mais évidemment pas.

Merci.

Span est un élément en ligne. Il n’a ni largeur ni hauteur.

Vous pouvez le transformer en un élément de niveau bloc, puis il acceptera vos directives de dimension.

 span.product__specfield_8_arrow { display: block; /* or inline-block */ } 

Essayez d’utiliser un div place de span ou d’utiliser l’ display: block; CSS display: block; ou display: inline-block;span est par défaut un élément en ligne qui ne peut pas prendre les propriétés de width et de height .

Inspiré de @Hamed, j’ai ajouté ce qui suit et cela a fonctionné pour moi:

 display: inline-block; overflow: hidden; 

Span ne prend la largeur et la hauteur que lorsque nous en faisons un élément de blocage.

 span {display:block;} 

Selon le commentaire de @Paul, Si display: block est spécifié, span cesse d’être un élément en ligne et un élément après son apparition sur la ligne suivante.

Je suis venu ici pour trouver une solution à mon problème de hauteur et j’ai une solution personnelle

Ajout de overflow:hidden; et keeing inline va résoudre le problème qui vient d’être testé en mode IE8 Quirks

span sont affichés par défaut en ligne, ce qui signifie qu’ils n’ont ni hauteur ni largeur.

Essayez d’append un display: block votre étendue.

Span commence comme un élément en ligne. Vous pouvez modifier son atsortingbut d’affichage pour le bloquer, par exemple, et ses atsortingbuts height / width commenceront à prendre effet.