| |
|
|
| | Подскажите, пожалуйста, как мне поступить.
Есть родительский блок div, назовем его bodys внутри его находятся другие блоки div. Блоки внутри раположенны друг под другом. Назовем их div1 div2 и div3.
У всех блоков height 100%, а width фиксированная в пикселах.
Под блоком bodys находится другой блок div footer, для которого блок bodys не является родительским и эти блоки расположенны друг под другом.
Теперь добавляем информацию в блок div2. Он начинает увеличиваться и перекрывать блок div3, который находится под ним, затем при увеличении информации, выходит с родительского блока bodys и перекрывает не только div3, но и div footer.
Вопрос. Что мне надо сделать, Что бы при увеличении блока div2 все блоки находящиеся под сдвигались вниз и блок div2 не перекрывал все блоки находящиеся под ним.
В IE подобных браузерах все нормально, а в отсальных (opera, mozila и т.д.) идет перекрытие блоков. | |
| |
|
|
| |
|
|
| |
для: andshk
(27.03.2010 в 12:47)
| | | Можешь выложить код, и скриншот этой конструкции, для наглядности, а то так трудно понять... | |
| |
|
|
| |
 92.3 Кб |
|
| |
для: Andreano
(28.03.2010 в 13:38)
| | | Постараясь прикрепить скин и код. Я никогда этого не делал и не знаю как, но попробую. | |
| |
|
|
| |
30.5 Кб |
|
| |
для: andshk
(28.03.2010 в 13:52)
| | | Это код css | |
| |
|
|
| |
30 Кб |
|
| |
для: andshk
(28.03.2010 в 13:53)
| | | А это код страницы. | |
| |
|
|
| |
|
|
| |
для: andshk
(28.03.2010 в 13:54)
| | | Это код страницы:
<!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" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="" />
<meta name="robots" content="all" />
<LINK rel="stylesheet" media="screen" type="text/css" title="Style" href="CSS/style.css">
</head>
<body>
<!--Шапка сайта-->
<div id="head">
<div id="LH">
<div id="l_menu"></div>
</div>
<div id="RH">
<!--Sitemap-->
<div id="sitemap">Sitemap</div>
<!--Поиск-->
<div></div>
<!--Верхняя навигация-->
<div id="top_menu">главная компьютероведам сайтостроителям уроки программы скрипты обо мне рицензии</div>
<!--Верхний анонс-->
<div id="top_anons" ></div>
</div>
</div>
<!--Средняя часть сайта-->
<div id="bodys">
<!--Верхняя граница таблицы-->
<div id="topB"></div>
<!--Левый контейнер, где форма рассылки и т.д.-->
<div id="lb">
<!--В этом контейнере левые анонсы непосредственно-->
<div id="l_anons"></div>
</div>
<!--Контейнер, где анонсы и контент-->
<div id="rb">
<p class="p">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce euismod blandit mi sed vehicula. Suspendisse malesuada imperdiet massa, eget porta nisl tempus id. Mauris tristique, turpis vitae vulputate aliquam, orci risus rhoncus sem, vel scelerisque augue leo non lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sagittis, felis sit amet eleifend accumsan, neque ante varius leo, euismod pellentesque arcu elit at nunc. Duis sollicitudin, massa id pharetra luctus, nibh ante porta mi, sit amet sodales turpis nibh et quam. Nunc semper posuere sem vehicula euismod. Curabitur id lorem libero. Sed magna neque, condimentum ac facilisis at, sagittis id tortor. Etiam iaculis bibendum ante, auctor vehicula quam cursus sit amet. Suspendisse nisi nibh, consectetur sit amet consectetur quis, laoreet ut velit. Proin interdum cursus dapibus. Curabitur tempus dui at velit ornare volutpat. Ut cursus congue ultrices. Vivamus et fringilla augue. Duis viverra, lorem blandit commodo tincidunt, orci ipsum feugiat metus, ut facilisis turpis eros at neque. Curabitur at ante ligula. Nulla dolor nisl, rutrum id fringilla et, aliquam vitae mi.
Mauris iaculis fringilla ante, nec volutpat nunc adipiscing sed. Ut tempus erat ante, vel scelerisque massa. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed at nisl vel dui </p>
</div>
</div>
<!--Нижняя граница-->
<div id="bot_tab"></div>
<!--Место для навигации-->
<div id="bot_nav"></div>
<div id="footer"></div>
</body>
</html> | |
| |
|
|
| |
|
|
| |
для: andshk
(28.03.2010 в 14:01)
| | | А это код css
/* CSS Document */
body
{
background-color: #f8f8f8;
margin: auto;
width: 100%;
}
div#head
{
width: 900px;
height: 483px;
margin: auto;
}
div#LH
{
width: 225px;
height: 483px;
float: left;
background: url(../img_shablon/1.jpg);
}
div#l_menu{
width: 173px;
height: 148px;
margin-top:310px;
margin-left:23px;
border-color:#FFFFFF;
border:solid 1px;
}
div#RH
{
width: 675px;
height: 483px;
background: url(../img_shablon/2.jpg) no-repeat;
float:right;
}
div#sitemap
{
width: 100px;
margin-left: 25px;
margin-top:23px;
}
*---------Здесь будет стиль для дива поиска-----------*/
div#top_menu
{
width: 650px;
height:18px;
margin-left: 25px;
margin-top:240px;
}
div#top_anons
{
width: 545px;
height:151px;
margin-left: 51px;
margin-top:15px;
}
/*-------------Средняя часть----------------*/
div#bodys{
width: 900px;
height: 100%;
margin: auto ;
background:url(../img_shablon/3.png);
}
div#topB
{
width: 900px;
height: 10px;
background:url(../img_shablon/3.1.png)
}
/*----------------В этом контейнере будет все, что слевой стороны------------*/
div#lb
{
width: 215px;
height: 100%;
margin-left: 10px;
float: left;
}
div#l_anons{
width: 200px;
height: 100%;
margin-left: 5px;
border-color:#000000;
border: solid 2px;
}
/*------------Здесь будет основной контент, анонсы и прочее-----ВОТ ЭТОТ БЛОК ПЕРЕКРЫВАЕТ ВСЕ НИЖЕНАХОДЯЩИЕСЯ БЛОКИ--------------*/
div#rb
{
width: 653px;
height: 100%;
background:url(../img_shablon/3.3mini.png) repeat-y;
float:left;
}
/*-------------Нижняя часть таблицы контента-------------*/
div#bot_tab
{
width: 900px;
height: 16px;
margin: auto ;
background:url(../img_shablon/4.png) no-repeat;
}
/*--------Место для навигации-----------*/
div#bot_nav
{
width: 900px;
height: 18px;
margin: auto ;
background:url(../img_shablon/5.png);
}
/*-------------Футер--------------------*/
div#footer
{
width: 900px;
height: 296px;
margin: auto ;
background:url(../img_shablon/6.png);
}
.p {
text-align: justify;
font-size : 14px;
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
font-style : normal;
margin-left : 15px;
margin-right : 30px;
margin-bottom:10px;
line-height: 20px;
color:#000000;
} | |
| |
|
|
| |
|
|
| |
для: andshk
(28.03.2010 в 14:13)
| | | Укажи пожалуйсто с каким дивом у тебя проблемма) ато ты в вопросе в обсчих чиртах описал) | |
| |
|
|
| |
|
|
| |
для: Andreano
(28.03.2010 в 20:37)
| | | Проблема с блоком:
div id="rb" ,
который находится в родительском блоке div id="bodys" .
Там же (в блоке div id="bodys") находятся блоки
<div id="bot_tab"></div>
<div id="bot_nav"></div>
Так вот div id="rb" перекрывает эти блоки, которые находятся под ним и находятся вместе с ним в родительском блоке <div id="bodys">.
А так же перекрывает <div id="footer">, для которого блок <div id="bodys"> не является родительским блоком, тоесть он находится под блоком (div id="bodys").
В итоге получается, что при увеличении контена в блоке div id="rb" все, что находится ниже, не зависимо родительский блок или нет, перекрывается блоком div id="rb" . | |
| |
|
|
| |
|
|
| |
для: andshk
(28.03.2010 в 22:20)
| | | Ну почему люди забыли табличный способ строения сайтов? | |
| |
|
|
