«абсолютный» означает абсолютный относительно ближайшего «относительного родителя». Относительный родитель - это либо элемент с позицией: относительный, либо, если его нет, документ.
Кроме того, создание абсолютного элемента имеет определенные последствия, например удаление его из потока документов. DOM будет выложен так, как если бы абсолютные элементы не существовали. Это означает, что контейнеры не будут обтекать абсолютные элементы и никакие элементы не будут вытеснены ими.
Позиционирование CSS может показаться черной магией, пока не будет обнаружено, что оно следует этим очень простым правилам - без исключений! (что хорошо)
Редактировать :
Специфика того, что вы здесь делаете, зависит от того, чего вы пытаетесь достичь. Почему вы используете абсолютное позиционирование? Абсолютное позиционирование имеет самые простые правила, но оно также очень мощное, а мощные инструменты также намного сложнее и требуют гораздо больше ручной работы, и у них больше шансов на то, что могут случиться плохие вещи. Это компромисс. Например, если один элемент увеличивается, не перемещая другие, чтобы принять это во внимание, они могут перекрываться. Абсолютное позиционирование зависит от того, сохраняете ли вы значения пропорционально для каждого элемента, чтобы убедиться, что все они выстроены правильно. И если вам нужен элемент обтекания, он требует, чтобы вы всегда обновляли свойства height
и width
, чтобы он был достаточно большим, чтобы иметь вид обтекания.
Чтобы воспользоваться преимуществами потока документов - обтеканием, автоматическим выравниванием и т. Д. - вы можете использовать плавающие поля, поля и отступы. Исходя из моего ограниченного понимания того, что вы пытаетесь сделать здесь, я бы установил отступ контейнера fieldset
, чтобы отразить, где должны быть расположены дочерние поля, и дал каждому полю поле. Для полей, которые должны располагаться справа от предыдущей, а не следующей строки, используйте float:left
и clear:left
.