Scrum
-
Posts
553 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by Scrum
-
-
не понял при чем здесь ширина и выравнивание по левому.
как бы предложил идею разделить на два блока
первый блок menu item
второй Subhead
или как ?
-
как вариант сделать ячейку с фикс высотой и overflow: auto | scroll;
-
а двумя отдельными блоками не покатит ?
-
<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;
-
ставим для 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> -
вот посмотри по поводу углов.
делал давно, но работает под всем.
-
И хочется без JavaScript его сделать!
-
Скинь архивчик на мыло.
-
хм... интересненько, на днях пересмотрю свое предложение и результат скину на мыло.
-
случаем не так должно быть ?
<!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>
как нас разбросало...
in Flame
Posted
Приезжай, я как раз там и живу.