Для конкретной компоновки, к которой вы привязаны, ее очень просто создать без необходимости устанавливать абсолютные или фиксированные позиции, которые будут работать и корректно отображаться в большинстве основных браузеров. Этот пример, который я сделал в jsFiddle , представляет собой очень простую фиксированную компоновку с использованием float, но также с заданной шириной.
У вас есть обертка, которая содержит весь ваш контент и расположена в центре окна, установив левый и правый поля автоматически.
Ваш заголовок, который заполняет всю ширину оболочки.
2 столбца, левый и правый, оба настроены так, чтобы плавать влево с четким исправлением под ним, так что любое содержимое после не будет пытаться плавать вдоль него.
И ваш нижний колонтитул, который отображается так же, как заголовок.
Это хорошо для использования в качестве макета, но, как и в примерах, связанных с asbjornu, после того, как вы начнете изменять размер браузера, так как ширина вашей обертки составляет 800px, когда ваш браузер опустится ниже этого, он не будет изменять размеры до чего-то меньшего так как это исправлено. Таким образом, содержимое будет затем прокручиваться пользователю. Для меня это не большая проблема, так как я знаю, что большинство людей не будут просматривать мой сайт с небольшим оконным браузером, и если это так, то они, скорее всего, привыкли к необходимости прокрутки, так как многие сайты сделаны так, и большинство смартфонов / планшетов автоматически изменяют размеры с функцией масштабирования, чтобы в любом случае правильно отображать их, поэтому большую часть времени это не составляет большой проблемы.
Но, конечно, бывают случаи, когда требуется адаптивный / гибкий дизайн, просто нужно знать, когда и где его использовать.