sergey-starostenko
-
Posts
7 -
Joined
-
Last visited
sergey-starostenko's Achievements
Explorer (1/14)
0
Reputation
-
Доброе врем суток! Столкнулся с такой проблемой. При переходе на новую строку, идет наложение картинки на картинку. Картинка кстати, при наведении меняется на другу. Код кину ниже. Как видно, вверху картинки ложатся друг на друга. Пытался сделать все что в голову пришло, ничего не получилось. А вот что нужно сделать: <!DOCTYPE html Version-1.0><html> <head> <title>Сотрудники</title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="style-employees.css"> <link rel="stylesheet" type="text/css" href="style-media-screen.css"> </head> <body> <div class="Employees-Box-Block"> <div class="Employees-Box-Block-Img"> <img class="Employees-Box-Block-Img-First" src="img/Josh.jpg" /> <img class="Employees-Box-Block-Img-Second" src="img/Josh_Hover.jpg" /> </div> </div> <div class="Employees-Box-Block"> <div class="Employees-Box-Block-Img"> <img class="Employees-Box-Block-Img-First" src="img/Josh.jpg" /> <img class="Employees-Box-Block-Img-Second" src="img/Josh_Hover.jpg" /> </div> </div> <div class="Employees-Box-Block"> <div class="Employees-Box-Block-Img"> <img class="Employees-Box-Block-Img-First" src="img/Josh.jpg" /> <img class="Employees-Box-Block-Img-Second" src="img/Josh_Hover.jpg" /> </div> </div> </body></html>* { margin: 0; padding: 0;}body { width: 100%;}.Employees-Box-Block { position: relative; width: 33.3%; float: left;}.Employees-Box-Block-Img { margin: 10px; position: relative;}.Employees-Box-Block-Img>img { width: 100%; position: absolute; display: block; top: 0; left: 0;}.Employees-Box-Block-Img>img.Employees-Box-Block-Img-First { opacity:0; filter:alpha(opacity=0);}.Employees-Box-Block-Img:hover img.Employees-Box-Block-Img-First { opacity:1; filter:alpha(opacity=100);}.Employees-Box-Block-Img:hover img.Employees-Box-Block-Img-Second, .Employees-Box-Block-Img>img.Employees-Box-Block-Img-Second:hover { opacity:0; filter:alpha(opacity=0);}.Employees-Box-Block-Img>img { -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}Прошу помочь кто чем может) Спасибо за внимание.
-
Простое позиционирование DIV, а куча проблем!
sergey-starostenko replied to sergey-starostenko's question in HTML Coding
Спасибо всем ОГРОМНОЕ!!! Все получается. Еще раз - СПАСИБО ВСЕМ)) -
Простое позиционирование DIV, а куча проблем!
sergey-starostenko replied to sergey-starostenko's question in HTML Coding
прошу меня простить, если что то не так. Но я добавил картинку (<div class="img1"><img src="b-img1.jpg"><div class="text">text</div></div>), поэкспериментировал с ее шириной, ничего не получилось. Вот картинка - http://cs623421.vk.me/v623421890/1e08e/yUDYGfREBTc.jpg. Если можете помочь, буду очень признателен. -
Простое позиционирование DIV, а куча проблем!
sergey-starostenko replied to sergey-starostenko's question in HTML Coding
Вот код: а вот результат: Черный блок, который находится выше красного предназначен именно для всего этого. А получается, что все эти div располагаются поверх всего. http://jsfiddle.net/23r802rm/ -
Простое позиционирование DIV, а куча проблем!
sergey-starostenko replied to sergey-starostenko's question in HTML Coding
это я все знаю, но я пробовал такой вариант, получилось что div с картинкой изменяется как надо. а div с текстом, независимо от div с картинкой, сам по себе и вообще бред получается -
Простое позиционирование DIV, а куча проблем!
sergey-starostenko replied to sergey-starostenko's question in HTML Coding
Проблема в том, что высота div с текстом должна автоматически изменятся, так же как и высота картинки в div img. -
Доброе время суток! Нашел в инете такую идею реализации блоков. Пытался ее реализовать 2 дня, не все получается, что хочется. Можете помочь кодом? Дело в том, что она еще и резиновая. Спасибо большое.