Botón CSS Sprite Con flotador: izquierda ... Sin centrar dentro de una tabla en Firefox

Increíble ... ¡algo que he conseguido trabajar en IE y NO en Firefox! Todo el giro de los acontecimientos, ¿eh?

De todos modos, aquí está el problema. Consulte la siguiente página tanto en IE como en Firefox:

http://www.lolstrategies.com/test/button_sample.html

Estoy usando este archivo para armar el botón.

enter image description here (http://www.lolstrategies.com/test/composite__V153767378_.png)

Obviamente este botón está centrado solo en IE ... ¡¿qué pasa ?! Estoy usando un intervalo para el fondo que está debajo del texto y otro para la sugerencia y luego los floto junto con float: left como puede ver al ver la fuente.

Entonces, ¿qué puedo hacer para centrar este lapso en Firefox?

Gracias de antemano ... por favor, avíseme si tiene alguna pregunta sobre esto que pueda ayudar a responder.

preguntado el 27 de agosto de 11 a las 17:08

2 Respuestas

Sus span.buttonLarge contiene dos elementos flotantes a nivel de bloque sin despejar, por lo que no tiene centrado. Para solucionar este problema, puede solicitar display: inline-block y margin: 0 auto a la misma.

PD: no tienes un DOCTYPE especificado, es por eso que su solución actual funciona en IE: la está renderizando en modo Quirks.

Respondido 27 ago 11, 21:08

Eliminar float: left; desde .primaryLargeButtonSpan y .primaryLargeButtonEnd

después de ese cambio display: block; a display: inline; desde .spriteButton span.button_label O cámbielo a display: inline-block; y luego, configure el background propiedad a url("./composite__V153767378_.png") no-repeat scroll left -76px transparent;

Sin embargo, es posible que notes algún "defecto" en la imagen final ...

Respondido 27 ago 11, 21:08

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.