Как удалить элемент из потока HTML / CSS?

Question

Как удалить элемент из потока HTML / CSS?

Я знаю, что " position: absolute "выведет элемент из" потока HTML/CSS", и он перестанет взаимодействовать со своими соседями. Какие еще существуют способы достичь этого?

819 8

css

8 ответов:

Comments

Ничего не найдено.

Matchu · Accepted Answer · 2010-06-08 02:24:42

нет?

Я имею в виду, кроме удаления его из макета полностью с display: none, Я почти уверен, что это все.

вы столкнулись с конкретной ситуацией, в которой position: absolute это не жизнеспособное решение?

Joe Flynn · Accepted Answer · 2011-11-04 19:03:53

один трюк, который делает position:absolute более приемлемым для меня является сделать его родителем position:relative. Тогда ребенок будет "абсолютным" относительно положения родителя.

jsFiddle

user · Accepted Answer · 2014-03-31 12:46:59

другой вариант-установить height: 0; overflow: visible; к элементу, хотя он не будет действительно вне потока и поэтому может сломаться маржа рушится.

Greg Hewgill · Accepted Answer · 2010-06-08 02:24:37

здесь display: none, но я думаю, что может быть немного больше, чем то, что вы ищете.

Sam Bowler · Accepted Answer · 2010-06-08 02:59:04

плавающий он реорганизует поток, но позиция: абсолют-это единственный способ полностью удалить его из потока документа.

Brian Lewis · Accepted Answer · 2017-04-07 18:28:18

position: fixed; также "поп" элемент из потока, как вы говорите. :)

position: absolute должно сопровождаться позицией. например,top: 1rem; left: 1rem

position: fixed тем не менее, разместит элемент там, где он обычно появляется в соответствии с потоком документов, но не позволит ему двигаться после этого. Он также эффективно устанавливает высоту до 0px (относительно dom), так что следующий элемент сдвигается вверх по нему.

Это может быть очень здорово, потому что вы можете установить position: fixed; z-index: 1 (или любой z-индекс, который вам нужен), чтобы он "выскочил" над следующим элементом.

это особенно полезно для фиксированных заголовков позиции, которые остаются в верхней части при прокрутке, например.

Jeremy Miller · Accepted Answer · 2015-05-20 04:50:00

Я знаю, что этому вопросу уже несколько лет, но я думаю, что вы пытаетесь сделать это так, чтобы большой элемент, например изображение, не мешал высоте div?

Я просто столкнулся с чем-то подобным, где я хотел, чтобы изображение переполняло div, но я хотел, чтобы оно было в конце строки текста, поэтому я не знал, где оно окажется.

решение, которое я понял, должно было поместить поле-дно: - высота элемента, поэтому, если изображение 20px хай,

margin-bottom: -20px; vertical-align: top;

например.

таким образом, он плавал над внешней стороной div и оставался рядом с последним словом в строке.

Massimo · Accepted Answer · 2011-12-28 12:43:57

попробуйте использовать это:
position: relative;
clear: both;
Я использую его, когда я не могу использовать абсолютное позиционирование, например в печати, когда вы используете page-break-after: always; работает только с position:relative.