Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> абсолютные дивы над текстом, как позиционировать относительно слов? 
V
    Опции темы
katka
  Дата 16.2.2007, 16:26 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 164
Регистрация: 19.7.2004

Репутация: 6
Всего: 6



Здравствуйте.
Подскажите, а есть какой-нибудь способ позиционировать абсолютные слои относительно (каламбурчик) конкретных мест текста? Например, мне нужны «всплывающие» дивчики под конкретными словами в предложении.
Я имею в виду, как это сверстать (скрипты не при чём).
Хотелось бы найти выход вроде «вклинивать в нужные места текста дивы с нужными стилями». Возможно такое?
--------------------
если с другом буду я, если с другом буду я, а медведь — без друга
PM MAIL WWW ICQ   Вверх
katka
Дата 16.2.2007, 17:09 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 164
Регистрация: 19.7.2004

Репутация: 6
Всего: 6



Слууууушайте. А если эти дивы писать в спанах с position:relative, то чего-то похожее получается. Только корректно ли так писать? Вообще нельзя же в спан совать див, да?
--------------------
если с другом буду я, если с другом буду я, а медведь — без друга
PM MAIL WWW ICQ   Вверх
SelenIT
Дата 16.2.2007, 17:16 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 97
Всего: 401



katka, по стандарту писать div в span нельзя, но можно писать span в span и задавать внутреннему span-у display: block - визуально выйдет аналог дива. Если же не гнаться за валидностью, то можно практически все)

А вот простейший пример с "чуть-чуть динамикой":
Код

a span { position: absolute; left: -1em; top: 1em; background: #ddc; display: none; text-decoration: none; }
a:hover { position: relative; } /* одним махом привязываем элемент и "приводим в чувство" hasLayout в IE */
a:hover span { display: block; }

Код

<p>Текст, текст, просто текст, очень много текста, опять текст, <a href=#>текст ссылки<span>Текст подсказки</span></a> и опять просто текст.</p>



--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
katka
Дата 16.2.2007, 17:41 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 164
Регистрация: 19.7.2004

Репутация: 6
Всего: 6



Да мне не столь важно, чтобы они всплывали при наведении. Хочется, чтобы они висели где надо.
Беда в том, что в самой всплывающей штуковине у меня ещё пяток дивов, не писать же их всех спанами (
Вообще, получается, моя проблема нерешаема, если в строковый элемент нельзя писать блочный. Почему так? Это несправедливо.

Но вообще, хорошая придумка, спасибо большое!
--------------------
если с другом буду я, если с другом буду я, а медведь — без друга
PM MAIL WWW ICQ   Вверх
SelenIT
Дата 16.2.2007, 18:21 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 97
Всего: 401



katka, так я ж говорю - задавайте вложенным спанам display:block и легким движением Ваши спаны превращаются... превращаются спаны... в нечто, визуально неотличимое от дивов ;)

Цитата(katka @  16.2.2007,  17:41 Найти цитируемый пост)
не писать же их всех спанами (

А почему бы и нет?

Цитата(katka @  16.2.2007,  17:41 Найти цитируемый пост)
в строковый элемент нельзя писать блочный. Почему так? Это несправедливо.

В HTML так ввели, чтоб порядок был... тогда, видимо, браузеры не умели отображать блоки в произвольном месте, вообще это к W3C вопрос... Но в CSS эту несправедливость по сути исправили... не формально, так хотя бы функционально.


--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0667 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.