Автор: Максим 18.2.2008, 22:28
Помогите пожалуйста, не могу добится того чтобы блок cont и cont2 при разных разрешениях, съезжались и разъезжались, блок cont2 должен все время быть с права, а блок cont должен разъезжатся и съезжатся до границ текста. У меня ни как не выходит.
Код
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Байки из склепа</title>
<style type="text/css">
body {
background-color:#89D0EE;
font-family: Arial, Helvetica, sans-serif; /* Рубленый шрифт текста */
margin: 0px; /* Отступы для браузера IE */
padding: 0px; /* Отступы для браузера Firefox */
}
h1 {
font-size: 36px; /* Размер шрифта */
font-weight: bold; /* Жирное начертание */
margin: 0px; /* Убираем отступы */
color: #fc6; /* Цвет текста */
}
h2 {
margin-top: 0px; /* Убираем отступ сверху */
}
#head { background-image:url(http://mediamos.ru/site/img/shapka112.jpg);height:285px;
}
.fon {height:285px; background:url(http://mediamos.ru/site/img/shapka1.jpg); background-repeat:no-repeat;}
.menu{
margin:293px 0px 0 0px;
position:absolute;
top:-144px;
left:3px;
display:block;
height: 600px;
width: 160px;
background-repeat: no-repeat;
background-image: url(http://mediamos.ru/site/img/fonlev.jpg);
}
#menu div {
padding: 2px; /* Поля вокруг ссылок */
}
#menu a {
display: block; /* Отображать ссылку как блок */
width: 190px; /* Ширина ссылки для браузера IE */
padding: 2px; /* Поля вокруг ссылок */
margin: 1px; /* Отступы вокруг */
font-size: 90%; /* Размер текста */
text-decoration: none; /* Убираем подчеркивание текста */
}
#menu a:hover {
background: #faf3d2; /* Цвет фона */
border: 1px dashed #634f36; /* Добавление пунктирной рамки */
margin: 0px; /* Убираем поля */
}
.cont { width:625px; height: 389px; background-image:url(http://mediamos.ru/site/img/cont.jpg); float:left;}
.cont2 {
width:200px;
height:389px;
background-image:url(http://mediamos.ru/site/img/cont2.jpg);
float: right;
}
.textz { margin-left:20px; margin-top:18px;}
.textz2 {margin-left:20px; margin-top:18px;}
#owercont {
width:81%;
height:390px;
margin-left:160px;
}
#line {
border-bottom: 1px groove #333; /* Линия между ссылками */
}
#foot { /* Нижний блок */
background: #333; /* Цвет фона */
padding: 5px; /* Поля вокруг текста */
color: #fff; /* Цвет текста */
clear: both;
}
</style>
</head>
<body>
<div id="head"><div class="fon"><div class="menu"></div>
</div></div>
<div id="owercont">
<div class="cont">
<div class="textz">Главная</div>
<div class="textz2">
<p>Компания Media House Group <br />
создана для того, чтобы обеспечить отечественного потребителя лучшим из того, <br />
что может предложить рынок. </p>
<p>Мы предоставляем широкий спектр услуг по следующим направлениям:<br />
• Проектирование и инсталляция сложных медиасистем и домашних <br />
кинотеатров класса High End;<br />
• Установка системы multiroom;<br />
• Разработка различных систем управления (Умный Дом)<br />
• Проектирование и инсталляция как проводной (Lan), так и беспроводной <br />
(Wi-Fi) сети;<br />
• Установка систем видеонаблюдения;<br />
• Изготовление эксклюзивных моделей компьютеров;</p>
</div>
</div>
<div class="cont2"><div class="textz">Бренды</div></div>
</div>
<div id="foot"></div>
</body>
</html>
Автор: total 27.2.2008, 19:20
Так как у Вас размеры заданы жестко для блоков cont и cont2 то можно попробовать выполнить абсолютное позиционирование этих блоков.