Search the Community
Showing results for tags ' div'.
Found 1 result
-
Приветствую! Ребят, что-то меня заклинило, и никак я не могу решить простую, в общем-то, задачу. Собственно, задача: поместить несколько таблиц друг в друга (без каких-либо промежутков) во весь экран. Когда содержимое внутренней таблицы не превышает высоту экрана, то всё хорошо. А вот когда контент не помещается, то таблица, соответственно, вырастает сообразно содержимому. А внешние-то table‘ы – нет! Так и остаются на месте. Как сделать так, чтобы они двигались вместе? http://s017.radikal.ru/i405/1605/4e/d5119940ed94.jpg http://s41.radikal.ru/i094/1605/75/58aae8416ead.jpg Подскажите, пожалуйста, решение проблемы. Перепробовал кучу вариантов. Всё не то. Наверняка есть более элегантный способ сделать то же самое. Спасибо. HTML: <html> <head> <title>Test</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div class="begin"> <table class="t1"><tr><td align="center" valign="top"> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <table class="t2"><tr><td align="center" valign="top"> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <table class="t3"><tr><td align="center" valign="top"> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text </p> </td></tr></table> </td></tr></table> </td></tr></table> </div> </body> </html> CSS: table.t1 { background-color: #004400; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; border: 12px solid #ff0000;} table.t2 { background-color: #0000ff; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; border: 12px solid #ff9933;} table.t3 { background-color: #440000; position: absolute; top: 0px; left: 0px; width: 90%; height: 100%; border: 12px solid #007700;} p {color: #ffffff;}
