kostya29
-
Posts
1 -
Joined
-
Last visited
kostya29's Achievements
Explorer (1/14)
0
Reputation
-
Есть двухколоночный резиновый шаблон. Цель добавить:внизу под центральным блоком две горизонтальные линии определённого цвета, и справа - вертикальную линию идущую от нижнего угла до середины правого блока. Так чтобы эти линии тоже были резиновыми вместе с центральным блоком, и нижние линии были внизу контента всегда, а вертикальная правая линия - справа после контента тоже независимо от растяжения экрана. Попробовал сделать это javascript-ом и выставлять позиции этих линий на событие window.onresize, но работает некорректно из-за того, что наличие самих линий - меняет размеры окна. Не знаю как это сделать с помощью средств css и html. У кого есть какие идеи? Возможно ли вообще такое сделать?Как оно вообще смотрится? Может лучше по-другому оформить? Картинка того, как должно выглядеть: http://pixs.ru/showimage/sitescreen_1234512_843811.jpg html cтруктура страницы: <body> <div id="header"> <h1></h1> <h2></h2> </div> <div id="outer_wrapper"> <div id="wrapper"> <div id="container"> <div id="content"><div class="sidebarmenu"> </div><div id="main"> <center> <img src="http://localhost/ci//images/oblojka_1024.jpg" border="0" alt=""/ align="middle"> </center> </div></div> </div> <div class="clearing"> </div> </div> </div> <div id='footer'><div id='footer_hor_line_small'></div><div id='footer_hor_line_big'></div><div id='footer_hor_line_vertical'></div> </body> некоторый css: * { margin: 0; } body { text-align: center; } html, body { height: 100%; } #header { border: 2px solid #52730A; background: #E8AF46; } #outer_wrapper { } #footer { display:none; } #footer_hor_line_big { position:absolute; left:210px; background-color:#52730A; height:5px; } #footer_hor_line_small { /* margin-left:50%;*/ position:absolute; background-color:#52730A; height:5px; } #footer_hor_line_vertical { position:absolute; background-color:#52730A; width:5px; } #wrapper { } #container { width: 100%; float: left; margin-right: -200px; } #content { background:#C28C49; } #main { margin-left: 200px; background:#F4DAA8; } .sidebarmenu { width: 200px; float: left; background:#C28C49; }