Divy wyrzucane poza przezroczyste section

0

Witam, właśnie zrobiłem ort! section, a w nim są divy. Problem jest taki, że gdy divy mają być obok siebie i ustawiam im float, to wtedy divy wyrzucane są poza tego diva ort!, gdy jeden div ma float: left, a drugi nic, to są oba w ort! section, ale są pod sobą, więc jest źle. A powinny być obok siebie w section ort!, czy ma ktoś pomysł, jak to naprawić?

Te dwa divy, są wyrzucane poza przeźroczysty game_description, natomiast h1 jest nadal w ort! section gdy nie ma ustawionego float.

<div id="game_panel_left">
               <p class="panel_left_paragraph">tekst</p>
       </div>
       <div id="game_panel_right">
              <p class="panel_right_paragraph">cos tam</p>
       </div>

Tutaj zaczyna się kod strony

<section id="game_description">
<div id="game_logo">
       <img src="images/obrazek.png" alt="" />
</div>
<div id="game_info">
       <h1>Jakis tekst</h1>
       <div id="game_panel_left">
               <p class="panel_left_paragraph">tekst</p>
       </div>
       <div id="game_panel_right">
              <p class="panel_right_paragraph">cos tam</p>
       </div>
</div>
</section>
#game_description {
	background-color: #000;
	width: 700px;
	height: auto;
	/*-khtml-opacity:.50; 
	-moz-opacity:.50; 
	-ms-filter:"alpha(opacity=50)";
	filter:alpha(opacity=50);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.5);
	opacity:.50; */
	color: #fff;
	margin: 0 auto;
	padding: 0 auto;
	display: block;
	/* For IE 5.5 - 7 */
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#fff, endColorstr=#fff);
	/* For IE8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#fff, endColorstr=#fff)";
	/* 50% opacity */
	background: rgba(0, 0, 0, 0.43);
	-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
}

#game_info {

}

#game_logo {
	padding-top: 50px;
	margin: 50px;
}

#game_panel_right {
	width: 199px;
	float: left;
}

#game_panel_left {
	float: left;
	width: 500px;
}
0

Nie wiem czy to jest profesjonalne rozwiązanie ale wrzuć przed końcem sekcji

<br style="clear: both;">
0

Działa! Dzięki wielkie :)
Czy możesz powiedzieć, jaki to ma wpływ na zachowanie tych dwóch divów?

1

Nie powinno mieć żadnego. Możesz też ustawić overflow: hidden w tym <section> zamiast tego <br />.

Ogólnie podstawy floatowania elementów ;)

0
dzek69 napisał(a):

Nie powinno mieć żadnego. Możesz też ustawić overflow: hidden w tym <section> zamiast tego <br />.

Ogólnie podstawy floatowania elementów ;)

Dzięki wielkie :)

1 użytkowników online, w tym zalogowanych: 0, gości: 1