Scrum
-
Posts
553 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by Scrum
-
Приезжай, я как раз там и живу.
-
не понял при чем здесь ширина и выравнивание по левому. как бы предложил идею разделить на два блока первый блок menu item второй Subhead или как ?
-
как вариант сделать ячейку с фикс высотой и overflow: auto | scroll;
-
а двумя отдельными блоками не покатит ?
-
frD-Помогите с версткой 2-х колонок (без absolute)
Scrum replied to Alexxx2783's question in HTML Coding
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> <style type="text/css"> /*<![CDATA[*/ #carrier { float: left; width: 100%; background-color: #404040; } #right_block { width: 200px; float: right; height: 100px; background-color: silver; margin: 10px; } #menu { margin-right: 230px; margin-top: 10px; padding-left: 10px; background-color: #606060; height: 40px; } #menu ul { list-style-type: none; margin: 0; padding: 0; } #menu li { float: left; display: block; background-color: #A0A0A0; padding: 10px 30px; text-align: center; border-right: 1px solid silver; } #menu ul li a { color: silver; font-family: tahoma; text-decoration: none; font-size: 79%; } #menu ul li a:hover { color: white; } #text { margin: 10px; font-family: tahoma; font-size: 79%; color: #C8C8C8; } 10px; /*]]>*/ </style> </head> <body> <div id="carrier"> <div id="right_block"> </div> <div id="menu"> <ul> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> </ul> </div> <div id="text"> Встала задача сверстать на первый взгляд простенький шаблон: - Справа блок фиксированной ширины 200px, остальное тянется - Красным меню, котороне не должно переноситься - черными линиями - основной текст, который обтекает блок Встала задача сверстать на первый взгляд простенький шаблон: - Справа блок фиксированной ширины 200px, остальное тянется - Красным меню, котороне не должно переноситься - черными линиями - основной текст, который обтекает блок Встала задача сверстать на первый взгляд простенький шаблон: - Справа блок фиксированной ширины 200px, остальное тянется - Красным меню, котороне не должно переноситься - черными линиями - основной текст, который обтекает блок Встала задача сверстать на первый взгляд простенький шаблон: - Справа блок фиксированной ширины 200px, остальное тянется - Красным меню, котороне не должно переноситься - черными линиями - основной текст, который обтекает блок Встала задача сверстать на первый взгляд простенький шаблон: - Справа блок фиксированной ширины 200px, остальное тянется - Красным меню, котороне не должно переноситься - черными линиями - основной текст, который обтекает блок Встала задача сверстать на первый взгляд простенький шаблон: - Справа блок фиксированной ширины 200px, остальное тянется - Красным меню, котороне не должно переноситься - черными линиями - основной текст, который обтекает блок Встала задача сверстать на первый взгляд простенький шаблон: - Справа блок фиксированной ширины 200px, остальное тянется - Красным меню, котороне не должно переноситься - черными линиями - основной текст, который обтекает блок Встала задача сверстать на первый взгляд простенький шаблон: - Справа блок фиксированной ширины 200px, остальное тянется - Красным меню, котороне не должно переноситься - черными линиями - основной текст, который обтекает блок </div> </div> </body> </html> -
text1text2
-
никак. как только когда габариты известны.
-
покажи код
-
<!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> <style type="text/css"> /*<![CDATA[*/ .one {width: 600px; height: 85px; border: 1px solid silver;} #two {width: 180px; height: 85px; border: 1px solid olive;} #two { text-align: center; display:table-cell; vertical-align:middle; } #two img { margin-top: expression(((two.offsetHeight/2) -parseInt(offsetHeight)/2) <0 ? "0" : (two.offsetHeight/2) -(parseInt(offsetHeight)/2) +'px'); } .three {height: 85px; border: 1px dashed red;} /*]]>*/ </style> </head> <body> <div class="one"> <div id="two"> <a href="boo.htm"><img src="boo.gif" /></a> </div> <div class="three"> <ul><li>boo</li></ul> </div> </div> </body> </html> для списка думаю по аналогии.
-
а у меня все нормально. для .rightcoln ставлю float: left; для #news-bottom-left clear: both;
-
стучись в аську, помогу.
-
попробуй для самого блока поставить float: left;
-
елементарная задача усложненная кроссбраузерностью.
Scrum replied to ua.rik's question in HTML Coding
ставим для inhead float: left; и продолжаем заниматься любовью. -
не тянется из-за доктайпа, поменяй на quot;-//W3C//DTD HTML 4.01 Transitional//EN"> немножко доработал твой код (показывает по всем одинаково) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title></title> <style type="text/css"> <!-- html, body { margin: 0; padding: 0; border: none; } #head { height:100px; width:30%; background-color:#475153 } #menu { float: left; width: 100%; height: 50px; background-color: #5a6164; } .vertmenu { margin-left: 30px; float: left; } .vertmenu ul { padding: 0; margin: 0; list-style-type:none; } .vertmenu li { float:left; font-family: Verdana; font-size: 14px; color:white; background-color: #475153; border-left:1px solid #5a6164; } .vertmenu a { padding-left:20px; line-height:50px; display:block; background: #475153; width: 130px; height: 50px; color:white; text-decoration: none; } .vertmenu a:hover { background: #cccccc; } --> </style> </head> <body> <div id="head"></div> <div id="menu"> <div style='height:50px;background-color:white;float:left;width:15px;'></div> <div style='height:50px;background-color:#475153;width:38%;float:left;border-right:1px solid white;'></div> <div style='height:50px;background-color:#5a6164;margin-left:30px;'> <div class='vertmenu'> <ul> <li><a href="#">Ввод</a></li> <li><a href="#">Вывод</a></li> <li><a href="#">F.A.Q.</a></li> <li><a href="#">Наши адреса</a></li> </ul> </div> </div> </div> <div style='height:75px;width:30%;background:#475153; '></div> <div style="width:30%;background:#475153;height:77%;">как растянуть этот блок до самого низа? не тянется млин</div> </body> </html> по поводу тянутся до низа без появления скролла это через ЖабуСкрипт
-
а можно для начало посмотреть как все должно выглядеть, а то у меня в разных браузерах разная картинка ? и если я понял то левый блок должен тянуться до низа без появления скролла ? и должен ли он появляться при переполнение контента ?
-
без JS не реально.
-
ну приблизительно так наверное <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title></title> <style type="text/css"> <!-- html, body { margin: 0; padding: 0; border: none; } body { background-color: background-color: #E0E0E0;; } #header { width: 1024px; height: 100px; background-color: gray; color: white; font-family: tahoma; text-align: center; font-weight: bold; float: left; } #menu { width: 200px; height: 80%; background-color: silver; float: left; margin-right: -3px; } #content { height: 80%; color: gray; font-family: tahoma; text-align: center; font-weight: bold; margin-right: 200px; } #menu_right { background-color: #FF0000; height: 80%; width: 200px; float: right; } --> </style> </head> <body> <div id="header"> header </div> <div id="menu_right"> </div> <div id="menu"> </div> <div id="content"> content content content content content content content content content content </div> </body> </html>
-
вот посмотри по поводу углов. делал давно, но работает под всем. http://photoexclusive.narod.ru/test/index.html
-
http://forum.htmlbook.ru/index.php?showtopic=187
-
Скинь архивчик на мыло.
-
хм... интересненько, на днях пересмотрю свое предложение и результат скину на мыло.
-
случаем не так должно быть ? <!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></title> <style type="text/css"> /*<![CDATA[*/ .piccont_all { background-color: red; float: left; } .pic { background-color: green; margin: 10px; float: left; height: 185px; width: 160px; } .pic p { margin: 0; } /*]]>*/ </style> </head> <body> <div class="piccont_all"> <div class="pic"> <img /><p>новый сервер</p><p>800x600 70k</p> </div> <div class="pic"> <img /><p>новый сервер</p><p>800x600 70k</p> </div> <div class="pic"> <img /><p>новый сервер</p><p>800x600 70k</p> </div> <div class="pic"> <img /><p>новый сервер</p><p>800x600 70k</p> </div> <div class="pic"> <img /><p>новый сервер</p><p>800x600 70k</p> </div> <div class="pic"> <img /><p>новый сервер</p><p>800x600 70k</p> </div> <div class="pic"> <img /><p>новый сервер</p><p>800x600 70k</p> </div> </body> </html>
-
<!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> <style type="text/css"> /*<![CDATA[*/ body { margin: 0; padding: 0; height: 100%; text-align: center; } div { height: 100%; margin: auto; width: 760px; background-color: silver;/*для наглядности*/ } /*]]>*/ </style> </head> <body> <div> ... </div> </body> </html>