Две колонки

depode · July 1, 2009

Здравствуйте, помогите решить проблему. CSS недавно начал осваивать.

Нужно что бы блоки news и menu обтекались блоком content

а получается вот что

CSS

#container {
 	width: 875px; 

}

#top {

 background:url(../images/top.jpg) no-repeat #000000;
 width:875px;
 height:427px;
}

#speedbar .leftb { 
 width: 115px;
 height: 32px;
 float: left; 
 color: white; 
 background:url(../images/b_l.gif) no-repeat #000000;
}

#speedbar .centerb {
 height: 32px;
 width: 732px; 
 background:url(../images/b_c.gif) repeat #000000;
 margin-left: 0px; 
 float: left; 
}

#speedbar .rightb { 
 height: 32px;
 background:url(../images/b_r.gif) no-repeat #000000;
 float: left; 
 margin-left: 0px; 
 width: 28px; 
}


#content {
 clear:both;
 width:875px;
 background:#000000;
}



#content .news{
 width: 580px;
 background-color:#151316;
 margin:5px;
 padding:0;
 float: left; 
}

#content .menu{


}

HTML

<body>
<div align="center">
<div id="container">
<div id="top"></div>
	 <div id="speedbar">
 	   <div class="leftb"></div>
	 	<div class="centerb"></div>
		<div class="rightb"></div> 
	 </div> 	
	 <div id="content">
	   	<div class="news">
	   		  <p>материал	   </p>
	   		  <p>материал</p>

	   		</div>
		<div class="menu">
	   		меню	  </div>
		 </div>
	<div>
<div>
</body>

Zippovich · July 1, 2009

Нарисуйте схематично, что Вы хотите получить, а то слова "обтекались" и "блоки", используемые в одном предложении меня ставят в тупик.

depode · July 1, 2009

1) как получается

2) как надо

Zippovich · July 1, 2009

в оранжевом блоке сделайте последним блоком следующий:

<div style="clear:both"></div>

Edited July 1, 2009 by Zippovich

depode · July 1, 2009

в оранжевом блоке сделайте последним блоком следующий:
<div style="clear:both"></div>

Уже прописал в стилях

#content {

clear:both;

width:875px;

background:#000000;

}

Вот полная схема, нужно красный в лево сместить, а зелёный вправо, и блок #content был на заднем фоне

Searcher · July 2, 2009

Вы нарисуйте как должно быть, а то не понятно что куда сместить...

А на будущее знайте, что плавующие блоки (это когда float влево или вправо) выпадают из общего потока, и чтобы их увидел родительский блок и растянулся, надо ему назначить overflow:hidden; и не нужно всяких лишних дивов делать.

depode · July 2, 2009

Вы нарисуйте как должно быть, а то не понятно что куда сместить...
А на будущее знайте, что плавующие блоки (это когда float влево или вправо) выпадают из общего потока, и чтобы их увидел родительский блок и растянулся, надо ему назначить overflow:hidden; и не нужно всяких лишних дивов делать.

Спасибо, разобрался, теперь буду знать

Sign In

Две колонки

Question

depode

Link to comment

Share on other sites

6 answers to this question

Recommended Posts

Zippovich

Link to comment

Share on other sites

depode

Link to comment

Share on other sites

Zippovich

Link to comment

Share on other sites

depode

Link to comment

Share on other sites

Searcher

Link to comment

Share on other sites

depode

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information