css positioning child/parent

Question

Мне было интересно, знал ли кто-нибудь из учебника или руководства о том, как ребенок/родитель работает в css с точки зрения позиционирования? Я пытаюсь расположить элемент div 50 px от другого элемента такого же типа, но я не могу заставить его работать.

// Thx заранее.

Answer 1

Официальная документация довольно хорошо:

Сначала вы должны научиться основам блочной модели:
http://www.w3.org/TR/CSS2/box.html

Тогда вы можете увидеть, что есть возможности для визуального форматирования:
http://www.w3.org/TR/CSS2/visuren.html

Answer 2

Чтобы использовать CSS для макета, вы должны быть знакомы с box model.

A List Apart также хорошо читается на эту тему.

Что касается вашей конкретной ситуации, будьте более конкретным.

Answer 3

CSS Mastery by Andy Budd - довольно хорошая книга, которую я рекомендую всем проверить. Вы должны захватить его, если хотите больше, чем простое понимание. В противном случае, если вы Google «Учебник CSS», вы получите миллион хитов.

Answer 4

Отличная новая книга под названием «Детектив CSS». Одна фраза предложения с примерами кода всех общих проблем с позиционированием, поплавками и т. Д., А затем есть четыре/пять тематических исследований со всем кодом для вас, чтобы посмотреть и понять, что не так все до объяснений.

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

Ребенок наследует свойства своих родителей, если не переопределен.

Похоже, что если вы используете поплавки, вы будете плавать влево/вправо и придерживаться поля слева или справа от 50 пикселей. Если абсолютное положение расположено, то просто проверьте экранные координаты и используйте влево: и верх: с px, куда его можно поместить.

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

Относительная установка концепции позиционирования/цели. Но он «относителен» к своей позиции внутри потока документов.