CSS: жидкое левое, зафиксированное право В центре, источник заказал расположение с минимальной шириной [дублирующаяся] / макс. [дублирующаяся] ширина
3 ответа
Я настоятельно рекомендую проверить шаблоны CSS на Dynamic Drive . Пятый из них должен быть тем, что вы ищете (с фиксированной жидкостью). Просто добавьте max-width и min-width к основному элементу контейнера, и все будет готово.
К вашему сведению, это действительно хорошие шаблоны для использования в качестве основы для макетов ваших страниц. Игра с CSS - отличный способ узнать много нового о перемещениях и позиционировании, и это действительно помогло мне в первые дни веб-разработки.
Моя попытка: http://www.ryankinal.com/fluid/
Это не полностью работает, хотя это только потому, что при очень маленьких размерах окна мои отрицательные поля могут привести к выпадению содержимого со страницы. Вот теория:
- контейнер в каком-то проценте
- левая колонка в 100% от контейнера, и плавающая левая
- правая колонка обернута в 0% ширины, обертка float-right
- правая колонка фиксированной ширины (200px в моем примере)
- левая колонка и левые поля правой колонки в половину ширины правой колонки (100px в моем примере)
Итак, чем больше правая колонка, тем больше вероятность, что содержимое выпадет. Но это настолько близко, насколько я смог приблизиться за добрый час или около того. Это также немного халтурно из-за того, что правая колонка обернута в посторонний div и использует преимущество overflow: visible.
Но это мои герцоги (на данный момент).
Вы ищете что-то подобное? (отрицательные поля + числа с плавающей запятой + правильный исходный порядок + фиксированное право)
http://blog.html.it/layoutgala/LayoutGala23.html
Дополнительные макеты на странице индекса: http: // blog. html.it/layoutgala/
, а затем просто добавьте минимальную / максимальную ширину в контейнер.