Ошибка цвета фона - PullRequest
Новая
       14

Ошибка цвета фона

0 голосов
/ 22 ноября 2011

Итак, я пытаюсь создать действительно простой лайтбокс, который я могу использовать для чего-то, однако по любой причине div, который должен затемнять фон, отменяет любой атрибут фона.

HTML 

<div class="zoom-placeholder">
    <div class="zoom-container">
        <img class="zoom" src="image.png" />
    </div>
</div>

CSS 

.zoom {
    margin: 1em 0em; padding: 1em;
    background: #f9f9f9;
    border: 1px solid #ccc; border-bottom-width: 2px;
    box-shadow: rgba(0,0,0,0.075) 0px 2px 3px, inset rgba(255,255,255,0.5) 0px 0px 25px;
    user-select: none;
    user-drag: none;
}
.zoom-container, .zoom-placeholder {display:table-cell}
.zoom-container.open {
    position: fixed;
    z-index: 999;
    width: 100%; height: 100%;
    top: 0px; bottom: 0px;
    left: 0px; right: 0px;
    background: rgba(0,0,0,0,0.5); /* <--- Not Working --- */
}
.zoom-container.open .zoom {
    width: auto;
    height: auto;
    position: absolute;
    margin: 0em;
    border-color: rgba(0,0,0,0.1);
    box-shadow: rgba(0,0,0,0.5) 0px 10px 30px, inset rgba(255,255,255,0.5) 0px 0px 25px;
}

Я ничего не пишу, но он все еще не отображается правильно.

Вы можете увидеть это здесь:

http://jsfiddle.net/JamesKyle/8H7hR/34/

Ответы [ 2 ]

2 голосов
/ 22 ноября 2011

Посмотрите на CSS background: rgba(0,0,0,0,0.5); /* <--- Not Working --- */ не работает, потому что это неверно, CSS3 должен быть background: rgba(0,0,0,0.5);
Обратите внимание на недостающее 0 у вас было 1 слишком много. R ed, G reen, B lue, A lpha прозрачность.:]

1 голос
/ 22 ноября 2011

Ваша проблема в том, что у вас слишком много параметров в операторе, который не работает (у вас 5, когда должно быть только четыре): 

background: rgba(0,0,0,0.5);

Примечание: пожалуйста, улучшите коэффициент приема.

...