gekas
Newbie-
Posts
8 -
Joined
-
Last visited
gekas's Achievements
Explorer (1/14)
0
Reputation
-
Да, фейковая картинка сработала. Спасибо большое zenw, SelenIT
-
Здравствуйте! Есть блок, в котором находится фоновая картинка(фоновую картинку вставил с помощью img, так как надо, что бы высота блока регулировалась по её пропорциям, если можно это сделать через backgound - буду ооочень благодарен, когда поделитесь методом, как это делается). Картинка спозиционирована relative и z-index: 1; Так же в блоке есть множество элементов с классом .m-pointer, которые принимают position:absolute, z-index:999. Проблема в работе псведокласса hover в ie8. Элементы .m-pointer визуально находятся сверху над главной фоновой картинкой, НО hover в ie8 не работает. Подскажите, как решить эту проблему.. Бьюсь уже несколько часов. .............. <img src="img/house.jpg" class="main-img" alt="main"> <span class="m-pointer p1" id="p1"></span> <div class="m-pointer p2" id="p2"></div> <div class="m-pointer p3" id="p3"></div> <div class="m-pointer p4" id="p4"></div> <div class="m-pointer p5" id="p5"></div> <div class="m-pointer p6" id="p6"></div> <div class="m-pointer p7" id="p7"></div> <div class="m-pointer p8" id="p8"></div> <div class="m-pointer p9" id="p9"></div>.......................main-img{ position: relative; display: block; width: 100%;z-index: 1;}.m-pointer{ position: absolute; cursor: pointer; width: 43px; height: 53px; z-index: 999; outline: 2px solid red;}.m-pointer:hover{ outline: 5px solid grey;}Сам пример: _http://gekas.e3w.ru/gidrosbor/
-
Пробовал - не работает. Когда поднимаем через z-index .m-pointer и добавляем ему outline, то видим, что m-pointer находится визуально уровнем выше, НО если прописать .m-pointer:hover{ outline: 5px solid grey;}В ie8 опять таки ничего не происходит. У меня скрипт прописан с использованием события mouseover для .m-pointer, который тоже не работает в ie8-9. Не могу определить причину. При чем если картинку .main-img сделать в пол ширины(что бы не все .m-pointer ы были над ней), то m-pointer ы, под которыми нет картинки - откликаются на наведение нормально
-
В ie8-9 Элементы с классом m-pointer находятся уровнем ниже main-img. Z-index не помогает при том, что элементы позиционированные. ...... <div class="m-pointer p1" id="p1"></div> <div class="m-pointer p2" id="p2"></div> <div class="m-pointer p3" id="p3"></div> <div class="m-pointer p4" id="p4"></div> <div class="m-pointer p5" id="p5"></div> <div class="m-pointer p6" id="p6"></div> <div class="m-pointer p7" id="p7"></div> <div class="m-pointer p8" id="p8"></div> <div class="m-pointer p9" id="p9"></div> <img src="img/house.jpg" class="main-img">........ .content{ position: relative;} .main-img{ display: block; width: 100%;} .m-pointer{ position: absolute; cursor: pointer; width: 43px; height: 53px;} Демо: gekas. e3w. ru /gidrosbor/ Как решить проблему?
-
Каким образом переводят цвет из формата rgb, в следующий: Код CSS 1 2 background: rgba(255, 255, 255, 0.3); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4cffffff', endColorstr='#4cffffff'); Подозреваю, что во втором случае цвет задан в hex. Где указывается прозрачность? И в целом каким образом переводится? Как, например, перевести: Код CSS 1 background: rgba(37,108,178,0.8);
-
Стоит задача: сверстать модуль "Отели" таким образом, как показано на изображении. Требования к верстке: 1) все блоки имеют равную высоту (определяется по самому высокому блоку) 2) при ширине окна > 1260 должно отображатся 4 блока на одном уровне, при < 1260 - три. Испробовал много различных подходов, и остановился-таки на таблицах.Но теперь возникла следующая проблема: таблица имеет специфику, что все ячейки адаптируются на ширину 100% и не получается выполнить перенос (например, задав 50% ширину каждому блоку) блоки адаптируются под ширину внешнего контейнера (display: table). Возможно ли исправить эту проблему в таблицах или следует использовать другой метод? <main id="mainO"><div> <img src="images/img1.png"> <p> <a href="#">Локейшн на Адмиралтейском</a> <span>Санкт-Петербург</span> </p> </div> <div> <img src="images/img2.png"> <p> <a href="#">Бест Вестерн Премьер МОНА Бутик</a> <span>Шерементьево</span> </p> </div> <div> <img src="images/img3.png"> <p> <a href="#">Приморье Spa</a> <span>Геленджик</span> </p> </div> <div> <img src="images/img1.png"> <p> <a href="#">Локейшн на Адмиралтейском</a> <span>Санкт-Петербург</span> </p> </div> </main>#mainO { display: table; table-layout:fixed; width: 100%; border-spacing: 20px; background: #ccc;}#mainO > div{ display: table-cell; background: rgb(89, 89, 89); width:50%; word-break: break-all;}
-
Skype: lionsua