| Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате |
| Форум программистов > Вёрстка веб-сайтов > Резиновая div-ная верстка |
| Автор: sssergius 15.10.2007, 11:01 |
| Всем привет. Есть вопрос по резиновой верстке дивами. Хочу сделать сайт, который будет тянуться вертикально и горизонтально - это идеальный вариант. Если это не возможно, приоритет - тянуться горизонтально. Причем, левый и правый блок должны быть фиксированной ширины, а центр тянуться. Перебрал 3 варианта верстки - но у каждого есть свои глюки. Можно оставить ссылки на работающие варианты. |
| Автор: viv 15.10.2007, 11:12 |
| пользовался как-то шаблонами, поковыряй может какой переделать сможешь |
| Автор: sssergius 16.10.2007, 11:43 |
| Спасибо за файлы. Но этот способ я уже знаю. Есть один недостаток - когда браузер сжимаешь, все столбцы сбиваются. А вы сами таким способом пользуетесь? |
| Автор: WebDisaster 16.10.2007, 14:08 |
| А http://www.alistapart.com/articles/holygrail видели? |
| Автор: sssergius 16.10.2007, 19:01 |
| Спасибо и за это пример. Но результат как и у предыдущего. Неужели никто не знает как сделать тянущийся сайта на дивах? |
| Автор: sssergius 16.10.2007, 21:46 |
| Неужели нет решения этой проблемы? |
| Автор: WebDisaster 17.10.2007, 03:58 | ||
Нельзя ли конкретизировать, что именно не нравится? Единственный замеченный мой глюк был в IE6 с бэкграундом для левой колонки, но и он исправлялся достаточно просто. Больше никаких проблем не видел. Правда, к 100% высоте, чтобы зафиксировать футер внизу, я не стремился. А что не устраивает Вас? |
| Автор: yalo 19.10.2007, 09:22 |
| у меня есть три файла сделала сама, от них часто начинаю "плясать" в начале работы по верстке, названия файла говорят об их сути |
| Автор: cleverbird 23.10.2007, 12:31 |
| #sidebar { float: left; width: 22%; } #sidebar2 { float: right; width: 23%; } #mainContent { margin: 0 24% 0 23.5%; } У тебя получится 3-х колоночный макет, с заданной шириной крайних колонок и "свободной" шириной средней колонки. Размеры всех колонок резинвые, т.е. будут зависеть от ширины окна. В данном случае, при уменьшении ширины окна, макет "сыпаться" не будет, т.е. колонки не будут "уходить" одна под другую. |
| Автор: sssergius 25.10.2007, 18:03 |
| cleverbird спасибо - это важно чтобы не сыпался, только крайние колонки должны быть фиксированными |
| Автор: cleverbird 25.10.2007, 18:11 |
| sssergius, Пожалуйста.  А они зафиксированы.  "Резиново".Задай ширину крайним колонкам в пикселах. Для центрального блока задай margin-right & margin-left те же значения (ну, или чуть больше), что и ширина крайних блоков. Т.е., если ширина левого блока, например, 200px, то центральному блоку задай margin-left:200px. Получит]ся, что центральный блок у тебя "отъедет" слева ровно на ширину левого блока, таким образом, они не будут у тебя накладываться один на другой. То же сделай с правым. |
| Автор: WebDisaster 25.10.2007, 18:26 |
| К этому css нужно добавить ещё одну очень важную вещь. Блок #mainContent дожен идти в html-потоке после блоков #sidebar и #sidebar2. Но Holy Grail всё равно лучше  |
