Что нужно прописать в CSS, чтобы форма была фиксированная?
Отборные материалы о дизайне, seo, wordpress

Что нужно прописать в CSS, чтобы форма была фиксированная?

Основное центральное тело сайта стоит на месте при любых обстоятельствах! Под обстоятельствами я понимаю – например когда человек свой браузер уменьшает, то сайт не меняется, а просто сдвигается в бок.

Проблема в том, что в файле header.php я поместил java форму, которое выезжает по нажатию, так вот, оно у меня плавает, когда человек меняет ширину браузера или заходит под другим разрешением экрана, форма входа и задний бекграунд java формы смещаются.

отвечает ETNO

Все просто, если нужно, чтобы слой был приклеенный к определенному положению (даже при прокрутке), то в css есть такое свойство как position:fixed Т.е. у вас будет что-то вроде

#form { position: fixed; top: 30px; left:50%; margin-left:-150px; width:300px; height: 200px; }

Такой код выровняет по центру слой с формой, при этом ширина формы будет 300 пикселей.

Единственная проблема, что position:fixed всеми любимый IE нифига не понимает, поэтому прийдется его хакнуть таким кодом

* html #form {
    position: absolute;
    top: expression(document.documentElement.scrollTop+document.documentElement.clientHeight-200+"px");
}

где 200 – это высота формы.

Пользуйтесь!


 

Похожие статьи:



3 комментариев к “Что нужно прописать в CSS, чтобы форма была фиксированная?”


9643e5d7

  1. Alex пишет:

    Спасибо!!
    А подскажите еще, у меня есть форма входа и форма регистрации они на одной странице находятся. в header.php я прописываю ихний код, т.е. сначала форму входа, потом сразу за ним форму регистрации. И на сайте они отображаются также, всмысле что вход первый идет, а под ним регистрация.
    А как сделать, чтобы они были рядом?

    Неправильно
    Вход
    регистрация

    Правильно
    вход регистрация

    Сделал в таблице все это дело, но у меня там проблемы из за нее возникают!
    Как сделать вход регистрацию рядом без таблицы?

    Заранее спасибо!

    • ETNO пишет:

      для этого существует правило float:left, а вообще это базовые правила, можете найти любой учебник в интернете по верстке, там это будет. Заодно и узнаете некоторые нюансы

  2. Alex пишет:

    Спасибо огромное! Все работает! Взял ваш первый совет и второй и все заработало как надо)

Смотреть все
ВНИМАНИЕ