Я пробовал несколько разных вещей, и я не уверен, как заставить этот нижний колонтитул придерживаться дна.Трудность возникает из-за того, что внутри друг друга есть несколько вложенных элементов div.То, чего я хочу достичь, это сделать так, чтобы обертки border-right и border-left шли в конец страницы, чтобы окружить нижний колонтитул, но нижний колонтитул должен быть внизу страницы.
, чтобы объяснить немноговсе вложенные элементы div: к телу применено основное мозаичное фоновое изображение, а у #background прозрачное наложение, которое заставляет его исчезать по краям.div-элементы border-right и border-left имеют повторяющееся изображение в качестве фона, который служит в качестве границ для содержимого div.
И div нижнего колонтитула должен быть полностью отделен, я знаю, но когда я делаю это так, он остается в центрена ширину окна, а не на ширину левой границы, поэтому это выглядит шатко, когда экран уменьшается.
Основная структура страницы выглядит следующим образом, и я также опубликовал jsfiddle: http://jsfiddle.net/cutcopypaste/zry4T/
<body>
<div id="background">
<div id="container">
<div id="header">
<div id="logo"></div>
<div id="menu">
<p>Menu</p>
</div>
</div>
<div id="border-left">
<div id="border-right">
<div id="content">
<p>Page Content</p>
</div>
</div>
</div>
</div>
<div id="footer">
<p>Footer</p>
</div>
</div>
</body>