ahtoh-d
-
Posts
3 -
Joined
-
Last visited
ahtoh-d's Achievements
Explorer (1/14)
0
Reputation
-
Верстка дивами. Выравнивание по вертикали.
ahtoh-d replied to Great Rash's topic in Tricks and solutions
Да согласен... уже учу) Уже и сам ошибку нашёл)... просто нужно было быстро сгенерировать сайтик... Кстати, окончательный вариант в хроме не пашет(... -
Верстка дивами. Выравнивание по вертикали.
ahtoh-d replied to Great Rash's topic in Tricks and solutions
Да! похоже на правду! СПАСИБО огромное)) Модифицировал немного под требования... 1. Резиновая середина. 2. блок контента не более и не менее 1000px тоже резина. Получилось нечто такое: похоже на правду? Но откуда взялась полоса прокрутки и как её убрать? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>An XHTML 1.0 Strict standard template</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <style type="text/css"> * { margin: 0; padding: 0; font: 12px Tahoma, Arial, sans-serif; } html, body { height: 100%; } #header { height: 100px; margin-top: 0px; background: red; width: 1000px; margin-bottom: auto; margin-left: auto; margin-right: auto; text-align: center; } .parent { min-width: 1000px; max-width: 1000px; height: 100%; margin: 0 auto; text-align: center; border: red 1px dotted; } .child, .helper { display: -moz-inline-block; display: inline-block; vertical-align: middle; } .child { width: 50%; } .helper { width: 0; height: 100%; } #foot { height: 100px; margin-top: -201px; background: red; width: 1000px; margin-bottom: auto; margin-left: auto; margin-right: auto; text-align: center; } </style> <!--[if lte IE 7]> <style type="text/css"> .child, .helper { zoom: 1; display: inline; } </style> <![endif]--> </head> <body> </div> <div id="header">header</div> <div class="parent"> <div class="child"> Я длинный предлинный текст, который обязательно перенесется на другую строку если ты, уважаемый юзер, соизволишь уменьшить размер окна. Но я все равно останусь по середине! </div> <div class="helper"></div> </div> <div id="foot">FOOTER</div> </body> </html> -
Верстка дивами. Выравнивание по вертикали.
ahtoh-d replied to Great Rash's topic in Tricks and solutions
помогите прикрепить к этому шаблону подвал с фиксированной шириной, прилепленный к низу экрана?((( никак не выходит... Ниже то, что я наваял. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>An XHTML 1.0 Strict standard template</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <style type="text/css"> * { margin: 0; padding: 0; font: 12px Tahoma, Arial, sans-serif; } html, body { height: 100%; } .header { max-width: 1000px; min-width: 1000px; height: 100px; margin: 0 auto; text-align: center; border: red 1px dotted; } .parent { max-width: 1000px; min-width: 1000px; height: 70%; margin: 0 auto; text-align: center; border: red 1px dotted; } .footer { max-width: 1000px; min-width: 1000px; height: 100px; text-align: center; margin-left: auto; margin-right: auto; border: red 1px dotted; } .child, .helper { display: -moz-inline-block; display: inline-block; vertical-align: middle; } .child { width: 50%; } .helper { width: 0; height: 100%; } </style> <!--[if lte IE 7]> <style type="text/css"> .child, .helper { zoom: 1; display: inline; } </style> <![endif]--> </head> <body> <div class="header"> header </div> <div class="parent"> <div class="child"> Я длинный предлинный текст, который обязательно перенесется на другую строку если ты, уважаемый юзер, соизволишь уменьшить размер окна. Но я все равно останусь по середине! </div> <div class="helper"></div> </div> <div class="footer"> footer </div> </body> </html>