Растягивание DIV

chipi · October 11, 2007

Есть два блока внутри одного, как сделать чтобы они не вылезали за пределы внешнего блока , при их растягивании.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML><HEAD> <TITLE></TITLE>
<style type="text/css">
#main-menu {
 background:RED;
 height: 35px;
}

#content {
 border: 1px solid blue;
 padding-bottom:10px;
}
#main-sec1{
 float:left;
 margin:5px;
 width:250px;
 border: 1px dotted black; 
}
#main-sec2{
 margin-top: 5px;
 margin-left: 265px;
 width:670px;
 border: 1px dotted black;
}

#main-bottom{
 height: 52px;
 background: GREEN;
}
</style>
</HEAD>
<BODY>
 <div id="main-menu"> 
 menu
 </div>
 <div id="content">
 <div id="main-sec1"> 
 tekst 

 tekst 

 tekst 

 tekst 

 tekst 

 tekst 


 </div>
 <div id="main-sec2"> 
 tekst 

 tekst 

 tekst 

 tekst 

 </div>
 </div>
 <div id="main-bottom"> 
 низ 
 </div>
</BODY></HTML>

klierik · October 11, 2007

для

задать фиксированную высоту и параметр overflow

chipi · October 11, 2007

в ie Все нормально , в вот FF и опера что-то не воспринимают...

{...перенесено в Слои kiD}

klierik · October 11, 2007

напишите плиз код который вы сейчас использовали

Vlad · October 18, 2007

Надо обтекание отменять с помощью

. Поставь этот блок после контента.

du-xa · February 28, 2008

Надо обтекание отменять с помощью
. Поставь этот блок после контента.

У меня такая же петрушка. Везде катит, кроме ie6 и старще. Там жестко и неприятно копирайт перекрывается высоким правым меню.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2002/REC-xhtml1-20020801/DTD/xhtml1-transitional.dtd"> 
<html>
<head>
<style type="text/css"><!--
#menuleft {
 float: left;
 border: 1px solid #000;
 width: 200px;
 padding: 5px;
 margin: 10px 10px 20px 5px;
}
#content {
 margin: 10px 225px 20px 225px;
 padding: 5px;
 border: 1px solid #333;
 min-height: 700px;
 font-size: 11pt;
}
#menuright {
 position: absolute;
 right: 0;
 top: 125px;
 border: 1px solid #333;
 width: 200px;
 padding: 5px;
 margin: 10px 5px 0 0;
}
#copyright {
 background: gray;
 color: white;
 padding: 3px 7px 3px 7px;
 clear: both;
 text-align: right;
 font-size: 11pt;
 border-top: 1px solid black;
 border-bottom: 1px solid black;
}--></style>
</head>
<body>

<div id="menuleft"></div>
<div id="content"></div>
<div id="menuright"><!-- высокая реклама от google --></div>

<div id="copyright"></div>
</body>
</html>

Scrum · February 28, 2008

У меня такая же петрушка. Везде катит, кроме ie6 и старще. Там жестко и неприятно копирайт перекрывается высоким правым меню.

не позиционируете правое меню, сделайте его то же флоатом.

du-xa · February 28, 2008

Не получается. Тогда это меню под контентом размещается справа... А мне надо на той-же строке

Scrum · February 28, 2008

css

#menuleft {float: left;}
#menuright{float: right;}

html

<div id="menuleft">left</div>
<div id="menuright">right</div>
<div id="content">center</div>

???

du-xa · February 28, 2008

Под седьмым IE выглядит прелестно, и в опере! Под шестым завтра проверю.

Спасибо, большое!!! Никогда не подумал бы, что от перестановки слагаемых сумма меняется...

du-xa · February 29, 2008

Все работает на всех браузерах!!! Непонятно, почему #content между двух блоков с заданным обтеканием не шел. Еще раз спасибо!

klierik · February 29, 2008

в начале идут обтикаемые объекты, а после них обтикающие их объекты

Sign In

Растягивание DIV

Question

Link to comment

Share on other sites

11 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information