Как я могу предотвратить это?

Question

http://removed.com/jquery/test.html

Играя с jQuery и нажимая «More» в левом верхнем углу, он толкает слой «Brown». Как я могу сохранить коричневый слой устойчивым? Это происходит в Chrome, но не в Firefox.

Answer 1

Лично я бы поместил этот набор полей в li, который является дочерним по отношению к тому, в котором содержится больше ссылок. Тогда абсолютно позиционируйте это. IMO, это более аккуратный код, чем его позиционирование абсолютно внутри страницы, это также означает, что если вы перемещаете навигационную панель, вам не придется снова возиться с перемещением набора полей.

Answer 2

Он выталкивается вниз, потому что div#header_link расширяется вместе с формой, поскольку находится в обычном потоке страниц. Используйте position: absolute для fieldset, чтобы вывести его из потока.

Кроме того, fieldset должен находиться внутри form, а не наоборот.

Примечание: подчеркивание не является допустимым символом для CSS-идентификатора, вместо него используйте дефис

Answer 3

Может быть, установив CSS

form {
   margin : 0;
   padding : 0;
}

Надеюсь, это поможет.

Answer 4

Попробуйте добавить несколько z-индексов и позиционирование:

#bag_info{
   ...
position:relative;
top: 10px;
left: 10px;
z-index:1;
  }

#more
{
position:absolute;
}

#more_searchbox /*you'll have to name this according to the search box*/
{
z-index:2;
position:relative;
top: 10px;
left; 10px; /*px values that work*/
}

Это может исправить это:)

Кроме того, вам может потребоваться настроить таргетинг на Chrome самостоятельно, так как FF работает, используйте этот селектор браузера CSS и поместите .webkit перед CSS, который вы хотите использовать для Chrome.