desbordamiento: los trabajos ocultos en Firefox pero no en Chrome. ¿Por qué?

He estado tratando de jugar un poco con el CSS3 y construir un logotipo de Netscape puramente de CSS3 para entrenamiento.desbordamiento: los trabajos ocultos en Firefox pero no en Chrome. ¿Por qué?

Aquí está el enlace:

http://alonbt.com/css3/netscape/

La cosa es: En Firefox todo se ve bien, pero en Chrome que algo va mal. Supongo que este es el overflow:hidden que tengo, en Firefox funciona, pero parece que Chrome no lo muestra bien.

¿Alguna sugerencia sobre cuál podría ser el problema?

Fuente

2011-08-08 Alon

¡Bien hecho! Parece que podría ser un problema con 'border-radius' con' overflow: hidden' como dijiste. Parece que webkit no comprende esos dos combinados, y lo trata como si fuera rectangular. Debes considerar presentar un informe de error en el webkit. http://www.webkit.org/quality/reporting.html – mqchen

¡Cosas geniales! Quizás el error que encuentre es este: http://code.google.com/p/chromium/issues/detail?id=60005. Esto puede ser un problema similar: http://stackoverflow.com/questions/5736503/how-to-make-css3-rounded-corners-hide-overflow-in-chrome-opera, que el póster pudo resolver. Noté que tomar 'posición: relativa' en 'whiteCircle' y' blackCircle' y moverlos con márgenes negativos funcionaba mejor, pero probablemente tengas una mejor idea de cómo lograr el efecto que estás buscando. –

hey, buen trabajo. Si lo desea, bifurque mi [proyecto Github] (https://github.com/thomas4g/CSS-Art) y agréguelo a la colección. :) ... es mucho mejor que cualquiera de los míos. –

he detallado este tema aquí: http://tech.bluesmoon.info/2011/04/overflowhidden-border-radius-and.html

En particular, estás siendo golpeado por https://bugs.webkit.org/show_bug.cgi?id=50072

El tema aparece en Safari también.

Fuente

2011-08-11 05:51:55 bluesmoon

Tengo que decir que estoy muy sorprendido de ver un problema como este en Webkit. – jffgrdnr

Será genial si agrega más detalles a la respuesta, no solo suelte algunos enlaces. – Pavlo

Puede solucionar este problema si no utiliza el posicionamiento relativo. Intente deshacerse de la propiedad CSS 'position: absolute' y use márgenes negativos en su lugar (por ejemplo, en su caso, algo así como: 'margin: -204px 0 0 -475px;').

Sin embargo, tenga en cuenta que tendrá que compensar de alguna manera el orden de los elementos (ya no tiene control sobre el índice z, pero lo necesita).

Fuente

2011-08-14 20:17:56 Yuval

Tuve el mismo problema en Chrome en una computadora con Windows, un img en un div, con desbordamiento: oculto en el div. En una Mac, todo se mostró bien, pero Windows Chrome ignoró el desbordamiento: oculto. Mi solución: -webkit-transform: scale (1); en el img (el niño).

Fuente

2013-07-16 13:13:30

desbordamiento: los trabajos ocultos en Firefox pero no en Chrome. ¿Por qué?

Respuesta

Cuestiones relacionadas