Ваше левое меню абсолютно позиционировано, поэтому оно перекрывает другое содержимое, когда размер окна слишком узок. Но решение этой проблемы довольно сложно и на самом деле зависит от того, чего вы хотите достичь.
Процент
Одним из возможных решений было бы установить width
для «divs» и «content» div в процентах. Таким образом, они никогда не будут пересекаться. Но это зависит от того, можете ли вы позволить себе иметь динамическую ширину для вашего «содержимого» div.
Перепозиционирование
Если ваш контент должен иметь фиксированную ширину ... Сначала вы должны решить, как бы вы хотели, чтобы ваш контент / меню отображался, когда окно слишком узкое (может быть, даже уже, чем ширина контента) ... И работать оттуда.
Ширина элемента кузова
Установите минимальное содержимое окна (как в <body>
) ширину. Либо с помощью:
- прозрачное изображение в начале вашего документа
<img src="t.gif" width="1250">
- установить минимальную ширину тела css как
min-width: 1250px;
должна быть шириной 1250 пикселей, потому что содержимое расположено по центру, поэтому оно должно иметь одинаковое пространство слева и справа (справа - бесполезное пустое пространство просто позволяя не перекрывать пространство слева от содержимого)
Последний на самом деле самый простой и работает. Это делает его чуть более широким для экранов меньшего размера, но ширина вашего контента (включая меню слева) уже превышает 1030 пикселей в любом случае ...