Падающая тень на контейнере отделения?
.page{ width: 100vw; height: 100%; min-height: 100vh; background: rgb(219, 101, 255); /*add following to center align content vertically */ display:flex; align-items: center;/*vertically align page_container*/ justify-content:center/*horizontally align page_container*/ } .page_container{ padding: 5vh 3vw; /* add following to center align content of page_container horizontally*/ text-align:center }Добавьте вышеуказанные правила в файл styles.modules.css.
Ссылка Codesandbox: https://codesandbox.io/s/olrvozl2z5?codemirror=1&fontsize=14
4 ответа
Вы можете попробовать использовать тени PNG. IE6 не поддерживает его, однако он будет нормально деградировать.
http://www.positioniseverything.net/articles/dropshadows.html
CSS3 имеет поле -тень свойство. В настоящий момент для максимальной совместимости с браузером требуются префиксы поставщика.
div.box-shadow {
-webkit-box-shadow: 2px 2px 4px 1px #fff;
box-shadow: 2px 2px 4px 1px #fff;
}
Генератор доступен по адресу css3please .
Наиболее широко совместимый способ сделать это, вероятно, будет создавать второй div под вашим блоком автоматического предложения того же размера, что и само поле, смещенный на несколько пикселей вниз и вправо. , Вы можете использовать JS для его создания и размещения, что не должно быть очень сложно, если вы используете довольно современный фреймворк.
вы можете попробовать это. Кажется, это довольно просто и работает, по крайней мере, на IE6 и Moz.
<div id ="show" style="background-color:Silver;width:100px;height:100px;visibility:visible;border-bottom:outset 1px black;border-right:outset 1px black;" ></div>
Общий синтаксис: граница- [позиция]: [стиль границы] [ширина границы] [цвет границы] | inherit
Список доступных [border-style] s:
- пунктирная
- пунктирная
- двойная
- канавка
- скрытая
- вставка
- нет
- начало
- ] гребень
- твердый
- наследование