python
-
Posts
3 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by python
-
Как растянуть div по высоте родительского элемента?
python replied to python's question in HTML Coding
http://pythoner.narod.ru/index.html -
Как растянуть div по высоте родительского элемента?
python replied to python's question in HTML Coding
Картина получается такая это заголовки [—-] [——-] [—-] * * * * * * это сам текст и в нем * * * * * * может быть несколько заголовков * * [——-] * * вокруг заголовка границы нет * * * * * * * * * * * * это примыкающие к центру картинки +***** +******** +***** получается боковые границы плавно переходят в изображение в td.content_footer. По аналогии работают и боковые колонки, но там все делается с помощью фона(background'а), так как их ширина заранее известна. В центре тоже самое не получается. Не совсем понял, что имеется ввиду. Думаю дело не в таблицах, возможно даже если сделать макет из div все равно возникнет вопрос о том, чтобы вытянуть div в центральной колонке на оставшуюся высоту. -
Всем привет! Собственно, у меня есть три колонки, две с фиксированной шириной по краям и одна в центре занимает все остальное пространство. Div#center служит для того, чтобы сделать границы между боковыми колонками и центральной. В нем находится заголовок и еще один div.content с границей по краям, при чем у заголовка границ быть не должно. Границы div.content соединяются с картинкой в td#content_footer, но только когда центральная колонка больше по длине, чем две соседние. Подскажите, как можно сделать так чтобы границы div.center примыкали к картинке в td#content_footer. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>TITLE</title> <style type="text/css"> td { padding: 0px; } div.header { height:120px; width: 100%; } td.flank { background: #e7eef0 url(question_files/flank_bg.png) repeat-y; width: 250px; vertical-align: top; } div#center { margin-left: 4px; margin-right: 4px; margin-bottom: 0px; position: relative; } div.title_text { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000000; font-weight: bold; padding: 23px 0px 0px 17px; } div.title { background-image: url(/img/title.jpg); background-color: #b8cecd; background-repeat: no-repeat; background-position: top right; height: 53px; width: 100%; } div.content { position: relative; text-align: left; border-left-width: 3px; border-right-width: 3px; border-top-width: 3px; border-bottom-width: 0px; border-color: #abc3c9; border-style: solid; font-family: Helvetica, sans-serif, Arial; font-size: 14px; color: #666666; margin-bottom: 0px; padding-bottom: 5px; } </style> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> <div class="header"> HEADER </div> <div style="width: 100%;"> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tbody> <tr> <td class="flank"> LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN LEFTCOLUMN </td> <td valign="top"> <div id="center"> <div class="title"><div class="title_text">Новые альбомы</div></div> <div class="content"> CONTENT </div> </div> </td> <td class="flank"> RIGHTCOLUMN </td> </tr> <tr> <td valign="top"> <img src="question_files/leftbottom.png" alt="" border="0" height="20" width="250" /> </td> <td valign="top" id="content_footer"> <div style="border: 0px solid rgb(171, 195, 201); margin-left: 4px; margin-right: 4px; background: rgb(231, 238, 240) url(question_files/center-bottom_bg.png) repeat-x scroll 0%; height: 20px; font-size: 1px;"> <img src="question_files/coner.png" alt="" align="left" border="0" height="20" width="20" /> <img src="question_files/border-color.png" alt="" align="right" border="0" height="20" width="3" /> </div> </td> <td valign="top"> <img src="question_files/leftbottom.png" alt="" border="0" height="20" width="250" /> </td> </tr> </tbody> </table> </div> <div style="width: 100%; padding-left: 30px; height: 50px;"> FOOTER </div> </body> </html>