Без поправок в CSS, модальное окно, открытое в модальном окне, выглядит не презентабельно — нет краёв.
Что бы поправить ситуацию, достаточно добавить CSS:
|
1 2 3 4 5 6 7 |
.modal:nth-of-type(even) { z-index: 1062 !important; } .modal-backdrop.show:nth-of-type(even) { z-index: 1061 !important; } |
Проблема обнаруживается в webview приложений на android. А именно, если где-то в коде есть radiobutton обёрнутый чем угодно, то при клике по нему, кратковременно (на долю секунды) выделяется вся строчка целиком.
Решение: достаточно добавить в стилевое оформление этого элемента cursor:default
Update: достаточно применить к body -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
Чтобы получилось нечто подобное:
HTML:
|
1 2 3 4 |
<div class="tile2"> <div class="icons_left"><img height="32px" src="/images/list.png"></div> <div class="icons_right" ><img height="32px" src="/images/heart.png"></div> </div> |
CSS:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
.tile2{ grid-template-columns: 50% 50%; display: flex; height: 100%; } .tile2>.icons_left { color: #003264; font-weight: bold; font-size: xx-large; text-align: end; margin: auto; cursor: pointer; } .tile2>.icons_right { color: #003264; font-weight: bold; font-size: xx-large; text-align: left; margin: auto; cursor: pointer; } |
Шел конец 2020 года, а мы всё еще не умеем штатно отображать символ рубля. Вот одно из решений:
1) Устанавливаем вот этот шрифт в css:
|
1 2 3 4 5 |
@font-face { font-family: "rouble"; src: url("/fonts/rouble.otf") format("opentype"); } .rub { font-family: "rouble"; } |
2) В коде прописываем:
|
1 |
<span class="rub">i</span> |
Каждый аз гуглю, когда нужно. Решил таки уж у себя сохранить 😉
|
1 2 3 4 5 6 7 |
body { background-image: url("../images/fone.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center; height: 100%; } |