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

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Firefox + position:relative не дает нажать ссылку 
:(
    Опции темы
Royan
  Дата 30.9.2007, 22:45 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Dreamer
***


Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

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



Вот собственно код

Код

<html>
    <head>
        <STYLE type="text/css">
        #formContainer {
            WIDTH: 560px;
        }

        #formContainer .fieldContainer {
            POSITION:relative;
            WIDTH: 350px;
            FLOAT:none;
        }
        </STYLE>
    </head>
    <body class="main">
    <div id="formContainer">
            <div class="fieldContainer" style="float: left;">
                <input maxlength="20" type="text"><br>
                <a href="http://google.com">Google</a>
            </div>
            <div class="fieldContainer">
                <input maxlength="20" type="text">
            </div>
    </div>
</body>
</html>


По определнным причинам, я кровь из носу должен использовать position:relative на всех DIV'ах класса fieldContainer, но из-за этого у Firefox'а возникает странный баг и он не дает мне нажать на обыкновенную ссылку! Как это побороть, оставив position:relative? Сложность в том что и форматирование хотелось бы оставить как есть...  Это поведение наблюдается только в Firefox'е

Это сообщение отредактировал(а) Royan - 30.9.2007, 22:46


--------------------
Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь
PM MAIL MSN   Вверх
SelenIT
Дата 30.9.2007, 23:24 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


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


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

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



Royan, а style="float: left;" у верхнего дива точно необходим (при том, что в классе указан FLOAT:none;)? Если этот float:left убрать, ссылка "оживает", а визуально ничего не меняется (два блока по 350px по-любому не уместятся в строчку в 560-пиксельном контейнере).

Если же float принципиален, то проще всего, имхо, "поднять" ссылки над контекстом:
Код

    #formContainer .fieldContainer a {
            POSITION:relative;
            z-index: 2;
    }

Почему сочетание float и position:relative дает такой странный эффект - не понимаю...


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


Dreamer
***


Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

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



SelenIT, Просто спас! Интересно что хак на ссылке с Z-INDEX работает только в комбинации с POSITION:relative; 
Еще раз спасибо!


--------------------
Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь
PM MAIL MSN   Вверх
SelenIT
Дата 30.9.2007, 23:46 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


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


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

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



Всегда пожалуйста;)

Цитата(Royan @  30.9.2007,  23:42 Найти цитируемый пост)
хак на ссылке с Z-INDEX работает только в комбинации с POSITION:relative; 

Это как раз по стандарту - z-index и работает только для позиционированных (absolute, relative и fixed) элементов. А вот почему float и relative "спотыкаются" друг о друга - загадка...


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


 




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


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

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