css float:left

harrison314

Zdravím,
potreboval by som pomôcť z CSS-kom,
mam box (class b1) v ktorom je hlavička ( class b2head) a veľa blokov, ktoré sú float:left; (class b3) , lenže orámovanie bloku
aj celí blok ich nezahŕňa ( obrázok v prílohe ) a bol by som rad keby všetky čierne bloky (b3) boli orámované blokom b1.

Kód: Vybrať všetko

<html>
<head>
<style>
.b1
{
	display: block;
	position: relative;
	left:50px;
	top:50px;
	border: 1px solid red;
	width:600px;
	padding:5px;
}
.b2head
{
	display: block;
	width:100%;
	height: 50px;
	border: 1px solid green;
}
.b3
{
	display: block;
	width: 45%;
	height: 50px;
	float: left;
	margin:2px;
	border: 1px solid black;
}
</style>


</head>
<body>
</body>
<div class="b1">
 <div class="b2head">
  Hlavicka
  </div>

  <div class="b3"></div>
  <div class="b3"></div>
  <div class="b3"></div>
  <div class="b3"></div>
  <div class="b3"></div>
  <div class="b3"></div>
</div>
</html>

ropman

daj do parent divu (b1)

Kód: Vybrať všetko

overflow: hidden;

awtt

musis zrusit float
bude to riesenie nadomnou aleb daj za posledny <div class="b3"></div> <div style="clear:both;"></div>

S.T.E.A.L.T.H

Štandardný problém float, stačí vyclearovať

Kód: Vybrať všetko

<html>
<head>
<style>
.b1
{
   display: block;
   position: relative;
   left:50px;
   top:50px;
   border: 1px solid red;
   width:600px;
   padding:5px;
}
.b2head
{
   display: block;
   width:100%;
   height: 50px;
   border: 1px solid green;
}
.b3
{
   display: block;
   width: 45%;
   height: 50px;
   float: left;
   margin:2px;
   border: 1px solid black;
}

.clear	{
	clear:both;
}
</style>


</head>
<body>
</body>
<div class="b1">
<div class="b2head">
  Hlavicka
  </div>

  <div class="b3"></div>
  <div class="b3"></div>
  <div class="b3"></div>
  <div class="b3"></div>
  <div class="b3"></div>
  <div class="b3"></div>
  <div class="clear"></div>
</div>
</html>

//edit

nedočítal som všetko, už to tu raz je, sorry

css float:left

css float:left

Re: css float:left

Re: css float:left

Re: css float:left