Evclid
-
Posts
9 -
Joined
-
Last visited
Evclid's Achievements
Explorer (1/14)
0
Reputation
-
Один div внутри другого. Как сделать чтоб div2 не вылазил за пределы div1, а обрезался? Т.е. от красного div должен остаться только маленький квадратик, который остался на div1. <div id="div1" style="background-color:Yellow; width:100px; height:100px;"> <div id="div2" style="position:relative; left:-40px; top:-40px; width:50px; height:50px; background-color:Red;"> </div> </div>
-
2Vlad: Спасибо, дружище! Это то что надо! 2ZoNT: Ответ копеечный. Надо же было так долго его искать? <!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"> <head><title> Page with fixed footer </title> <style> html, body {margin:0;overflow:hidden;} #content { position:absolute; top:0; bottom:60px; left:0; right:0; background-color:#DDFFFF; overflow:auto; } #footer { position:absolute; bottom:0; background-color:#FFFFDD; height: 60px; width:100%; } </style> </head> <body> <div id="content"> <script language="javascript" type="text/javascript"><!-- var str=""; for (var i = 0; i < 20; i++) str = str + "<br>content " + i; document.writeln(str.substring(4)); --></script> </div> <div id="footer">Footer</div> </body> </html>Всем спасибо (:
-
Решение вижу только в java script: <!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"> <head><title> Page with fixed footer </title> <style> * { margin:0; padding:0; } html, body { height: 100%; overflow:auto; background-color:#DDFFFF; } #content { background-color:#DDFFFF; overflow:auto; } #footer { position:absolute; bottom:0; background-color:#FFFFDD; height: 60px; width:100%; } </style> <script language="javascript" type="text/javascript"><!-- function FixContentHeight() { var content = document.getElementById("content"); var footer = document.getElementById("footer"); var height = parseInt(document.body.clientHeight) - parseInt(footer.clientHeight); if (height > 0) content.style.height = height + "px"; } --></script> </head> <body onload="FixContentHeight()" onresize="FixContentHeight()"> <div id="content"> <script language="javascript" type="text/javascript"><!-- var str=""; for (var i = 0; i < 20; i++) str = str + "<br>content " + i; document.writeln(str.substring(4)); --></script> </div> <div id="footer">Footer</div> </body> </html>Вдруг кто знает как сделать тоже самое без JS - напишите...
-
2Scrum Все бы хорошо - но footer должен иметь не относительную высоту, а абсолютную (30px к примеру). Там же меню.Соответственно у контента высота - все оставшееся пространство (100% - 30px).
-
Легко сказать. Я целый день парился с этим - так и не смог.Либо футер уезжает при контенте болше страницы, либо контент частично уезжает выше нормы, либо как вариант еще было что футер начинался сразу под страницей... Подскажите плз кто-нибудь рабочий пример?
-
Спасибо. Вы мне очень помогли.Я думаю что попробую и скриптом обойтись и затем, пожалуй, поиграю в DIVный вариант. Сравню, погляжу что да как. Чат мне нужен не срочно - это просто мои попытки попрактиковаться в html и, что интересней, ASP.NET. Со штанами Вы, конечно, переборщили, а ошибочка моя - это результаты полуночной невнимательности (:
-
Мне больше нравится думать что DIVы в таблицах имеют место быть. Конечно я могу переписать все на DIVы, но хочется найти решение проблемы а не уйти от нее.. Надеюсь Вы понимаете (: 2Argus Спасибо за советы 1,4 Вы правы, я просто не стал париться над этим т.к. это не создает проблем. Может пока... 3. Поддерживаю 2. Похоже действительно придётся попробовать такой вариант, раз других нет. PS: Жаль что один стандарт все по своему интерпритируют... Выходит учится html - это постоянный поиск каких-то уловок.
-
К сожелению это не работает ):
-
Привет, Помогите новичку, как говориться (: Это прототип чата... Страничка ведет себя как надо в IE и Opera, но overflow: auto никак не хочет отрабатывать в FF. Когда окно уменьшается у DIVа (id="chat") должен появиться scroll... Только стал разбираться с html и на тебе, сразу вляпался в каие-то проблемы. Даже обидно. ): <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml"> <head><title> Untitled Page </title></head> <body> <table width='80%' border='0' style="height: 100%;"> <tr> <td colspan='2' valign="top" style="height: 100%;"> <div id="chat" style="width: 100px; height: 100%; overflow: scroll; background: #dddddd";> <span style='color:#00DD45;'>20:23</span> jhgjhj<br> <span style='color:#00DD45;'>20:23</span> ;;;;;;;<br> <span style='color:#00DD45;'>23:52</span> xcv<br> <span style='color:#00DD45;'>23:54</span> ggggg<br> <span style='color:#00DD45;'>23:55</span> ggff<br> <span style='color:#00DD45;'>23:55</span> aaa<br> <span style='color:#00DD45;'>23:56</span> bbb<br> <span style='color:#00DD45;'>23:56</span> cccc<br> <span style='color:#00DD45;'>23:56</span> ddd<br> <span style='color:#00DD45;'>23:56</span> tyututy<br> <span style='color:#00DD45;'>23:56</span> xxxx<br> <span style='color:#00DD45;'>23:56</span> yyyy<br> <span style='color:#00DD45;'>23:57</span> zzz<br> <span style='color:#00DD45;'>12:46</span> jjj<br> </div> </td> </tr> <tr> <td style="width: 100%"><input name="TextBox1" type="text" id="TextBox1" style="width:100%;" /></td> <td style="width: 200px"><input type="submit" name="Button1" value="Send" id="Button1" style="width:100%;" /></td> </tr> </table> </body> </html>