Ребята, пожалуйста помогите реализовать меню и футер с параметром width:100%, т.к. это представлено на изображении снизу. Я читал, что нужно menu и footer вынести на пределы контейнера. Но у меня не получается. Помогите пожалуйста решить эту задачу. Работаю на основе стандартного шаблона. Буду очень признателен любому совету или подсказке. Спасибо за внимание!
В данном случае вам нужно будет удалить свойство Код: #container{width:980px;margin-left:auto;margin-right:auto;} Итак, теперь вся страница расползлась по ширине, теперь добавьте Код: #header{width:980px;margin-left:auto;margin-right:auto;} Как видим, блок header выравнен по центру. Теперь нужно создать новый блок, который будет вмещать в себя содержимое страницы, начиная с меню и кончая началом футера(он будет выровнен по центру). Назовем его h_container. Так как разметка модуля "такая непривычная", не знаю как её обозвать, блок h_container будет открываться в файле header.tpl, а закрываться в footer.tpl. В файле header.tpl перед блоком <div id="notification"></div> добавить Код: <div id="h_container"> В файле footer.tpl в самом начале добавить Код: </div> и прописать стиль Код: #h_container, #header{width:980px;margin-left:auto;margin-right:auto;} Если что-то будет криво отображаться, пеняйте на себя. Т.к. я делал по памяти. Возможно придется удалить блок container(начало из header.tpl, конец из footer.tpl).
Возможно контейнер стоит оставить без изменений, а сам футер вынести в вёрстке за пределы контейнера. Как вариант
Я так пробовал, но к сожалению ничего у меня не вышло. Вроде все эллементарно, но не получается :(. Может у кого-то есть пример header.tpl с данной реализацией? Спасибо.
Тогда можно контейнер резиновым сделать. Попробовать #container{width:100%;margin-left:auto;margin-right:auto;} --- Добавлено, 17 окт 2013 --- Вроде частично получилось Всё растягиваем #container { margin-left: auto; margin-right: auto; text-align: left; width: 100%; } делаем фиксированным основной блок сайта и выравниваем по центру #content { margin: 0 auto; min-height: 400px; width: 980px; } Жирным - что изменено или добавлено
Yoda, спасибо большое за очередную подсказку! Скажите пожалуйста, мне эти действия нужно сделать в изначальном файле css или уже с действиями которые описал halfhope? --- Добавлено, 17 окт 2013 --- Да Yoda, действительно частично получилось! Большое Вам спасибо! Единственное, что хотелось бы так это выравнять элементы меню по центру и сделать футер резиновым. Скриншот прилагается ниже:
как сделать, чтобы сами элементы меню были по центру, при чёрном фоне на всю ширину - я не знаю. Я когда-то такое хотел сделать, долго пробовал разные варианты, у меня ничего не получилось, и я забил на это... Можно к самому меню #menu применить такой же код, как к content, само меню будет по центру, но элементы также будут слева. Футер на всю ширину же? Разве это не резиновость?
