CSS: Div внутри другого div

Question

У меня есть элемент div (класс «content»), который содержит 2 div и родственный элемент первого div, который имеет bottom: 0px;атрибут и фиксированная высота, и я хотел, чтобы div с классом «gallery» расширился настолько, чтобы они не пересекали родительский div.

, а также ... я видел это, кроме браузера Firefox, Chrome, opera и safari показывает результаты поиска в верхнем правом углу на 4-5 пикселей выше, чем обычно.почему это?

http://goaltod.iulianonofrei.com/

Answer 1

У вас есть 2 вопроса здесь.Первый вопрос не ясен, «содержит 2 div и родной брат первого div», не родной брат первого div - второй div?Также неясно, что вы хотите сделать, в общем, кажется, что у вас все глобально расположено, так что почему бы вам не установить div галереи с точными размерами, которые вы хотите.Для содержимого, которое он содержит, вы можете использовать overflow: auto, чтобы при необходимости он создавал внутренний скроллер.

По второму вопросу похоже, что проблема в Firefox.если вы установите верх и отступ элемента ввода равным 0, он все равно выравнивается с содержащим элементом td.Это очень странное использование элементов таблицы, и я бы посоветовал против этого ... Вам, вероятно, следует вместо этого использовать элементы div.

Answer 2

Поскольку вы использовали height: 100%, содержимое будет соответствовать высоте родительского элемента. И другие элементы толкают его вниз.

Есть несколько способов исправить это:

• Использовать макет таблицы (полностью поддерживается, но не одобряется)
• Использовать новый макет CSS 3 flex box (без поддержки старого IE)
• Поместите верхний и нижний колонтитулы в содержимое, затем разместите их как абсолютные.

Я бы порекомендовал третий вариант, который демонстрируется здесь: http://jsfiddle.net/tnRpR/