Trol

У меня еще была мысля такая: сделать кнопочки со свойством :active и чтоб при нажатии выходили дивы, но беда в том что свойство :active срабатывает на нажатие, а не отпускание кнопки. А так можно было бы нажатием открыть и нажатием закрыть! Но опять же без ЖС не обойтись(насколько я знаю)!

Что ж спс за ответы! Жаль канечно! Просто задумка сайта не огромная и я решил ограничиться только css, поэтому и надежды были на него!

Я нужную высоту не знаю и ставлю на авто! Вдруг я захочу чего-то туда добавить но так чтоб мне не приходилось беспокоиться о высоте! Может я что-то не понимаю!

В смысле обрезается? Он просто при всплывании выходит за границу вниз и видно только часть содержимого! А я подумал может есть такая реализация чтоб при всплытии он не часть показывал а (расширял)прокручивал страницу чтоб содержимое отобразить полностью!

Вот страница Так выходит а хотелось бы так Т.е при разворачивании дива прокручивался экран для показа содержимого полностью!

Это код страницы <div class="acessel" > <!--название картинки--> <div class="headcol"> <span class="colh">Заголовок</span> </div> <!--сама картинка--> <div class="img"><img alt="" src="acces_iphone/image/handsfree.png" /></div> <!--краткое описание картинки--> <div class="botwrap">(краткое описание ) <div class="actbutt"> <!-- ниже кнопочка--> <a style="text-decoration: none" href="#"><span class="butt">Подробнее...<img alt="" src="acces_iphone/image/arrow-down.png" /></span></a> <!--вот тут уже всплывающий div--> <div class="infoblock"> <p>Полное описание картинки</p> </div> </div> </div> </div> теперь стили .acessel{ position:relative; width:50%; display: inline; float:left; background-color:#FFFFFF; height:auto; box-shadow:0px 1px 3px rgba(0,0,0,0.3); -webkit-box-shadow: rgba(0,0,0,0.3) 0 1px 3px; -moz-box-shadow: rgba(0,0,0,0.3) 0 1px 3px; } .botwrap{ border-top:1px solid #CCCCCC; display: block; background: -moz-linear-gradient(#F9F9F9,#EBEBEB); background: -webkit-gradient(linear, 0 0, 0 100%, from(#F9F9F9), to(#EBEBEB)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F9F9F9', endColorstr='#EBEBEB'); max-width:100%; margin:0 auto; height:auto; padding:5px; } div.actbutt{ display: inline; position:relative; } .butt{ text-align:center; color:#FFFFFF; font-weight:bold; background: -moz-linear-gradient(#CCCCCC,#999999); background: -webkit-gradient(linear, 0 0, 0 100%, from(#CCCCCC), to(#999999)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCCCCC', endColorstr='#999999'); -moz-border-radius:6px; -webkit-border-radius: 6px; box-shadow:0px 1px 3px rgba(0,0,0,0.3); -webkit-box-shadow: rgba(0,0,0,0.3) 0 1px 3px; -moz-box-shadow: rgba(0,0,0,0.3) 0 1px 3px; width: 50%; margin: 0 auto; display: block; } .infoblock{ position:relative; width:100%; margin:0 auto; height:auto; display:none; overflow:visible; } .actbutt:hover .infoblock { top: 1px; display:block; } вот собственно то что относится только к этим элементам.

Всем привет! Прошу помощи!!!Скрипты не предлагать!! Создал страницу на которой отображаются div(общий)-->div(внутренний):картинка ->(ниже картинки) div(внутренний, но скрыт) и <--в этом то div'е краткое описание содержимой картинки! Далее поставил кнопочку(оформил стилями) и при наведении на нее курсора вплывает этот скрытый div с описанием картинки! Проблема такая: сборок с картинками много и к каждой такое скрытое описание, но нижние элементы при просмотре описания всплывают вниз за границы экрана и части текста не видно(приходится прокручивать вниз вручную) ! Есть ли возможность всплытия вниз так что описание выходило полностью пусть и страница немного прокрутится сама вниз! Или я тупой или такой возможности нет!