Acabo de encontrar el problema más extraño que he encontrado en mi humilde página web desarrollando una carrera independiente. Estoy creando una aplicación web para un sitio de solicitud de empleo donde los solicitantes usan sus cámaras web para responder 3 preguntas breves. Para esto utilizo un plugin jQuery llamadoScriptCam que utiliza Flash para activar la webcam del usuario. Tenía todo esto funcionando bien, pero ahora tengo el siguiente problema.

Yo uso jQuery.show() y.hide() para mostrar y ocultar botones. Un botón, un botón de repetición, no aparece cuando se llama$("#replay").show(); ¡pero se muestra cuando hago clic derecho en cualquier parte del navegador después de llamar a este comando y presiono "Inspeccionar elemento"! He estado buscando qué podría causar este problema pero no he encontrado nada ... ¿Qué podría causar este comportamiento?

Así es como he definido el botón:

<div onclick='replay();' id='replay' class="replay">Replay</div>

Este es el CSS del botón:

.replay{
    float: left;
    top: 150px;
    left: 60px;
    z-index: 100;
    -webkit-box-shadow: 0 12px 36px -16px rgba(0,0,0,0.5);
    background:url('../img/button-grey.png') no-repeat 100% 100%;
    background-position: center center;
    color: white;
    width: 140px;
    text-align: center;
    padding: 10px;
    cursor: pointer;
    font-family: Archive;
    display: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

Edición: Esto es CSS de la división principal del botón:

.box{
    margin-left: 100px;
    height: 337px;
    width: 300px;
    float: left;
    text-align: center;
}

No he usado ningún retraso en ninguna parte y el botón aparece realmente justo después de hacer clic en el elemento de inspección en algún lugar del navegador. Tampoco puedo reproducir este problema en ningún otro lugar. Alguien tuvo una idea de lo que podría causar esto? Cualquier ayuda sería muy apreciada, gracias de antemano!

Actualización: Parece que solo Safari en Mac tiene problemas.

Actualización 2: ¡Al mover el botón fuera de su división principal directamente a la etiqueta del cuerpo, funciona como debería! Entonces, ¿es probable que sea un conflicto CSS del div principal?

Edit: puedes ver el problema en vivoaquí, simplemente presione el botón "Volgende vraag" y espere a que termine el pequeño video. Después de eso, el botón de reproducción debería aparecer justo encima del video.