W przykładzie MZ też jest sztywny kontener a mimo to trzeba czyścić przepływ...

pytanie zadane 14 sierpnia 2017 w HTML i CSS przez wawszczur Użytkownik (610 p.)
zamknięte 14 sierpnia 2017 przez Arkadiusz Waluk

Dzięki za odpowiedź ale nadal nie jest to całkowicie jasne. W przykładzie MZ jest analogiczny kod tzn. też jest sztywny kontener a mimo to w odróżnieniu od mojego kodu trzeba czyścić przepływ. Musi być jakaś inna przyczyna... W załączeniu kody z przykładu MZ:

Kod HTML:

<!doctype html>
<html lang="pl">
<head>
	<meta charset="UTF-8"/>
	<title>Książki science fiction, które musisz przeczytać</title>
	<meta name="description" content="Lista najlepszych książek z zakresu fantastyki, science-fiction wartych przeczytania! Fantastyka naukowa - TOP Lista wszech Czasów"/>
	<meta name="keywords" content="książki, science, fiction, fantastyka, sf">
	<meta name="author" content="Romuald Wawszczak">
	<meta http-equiv="X-Ua-Compatible" content="IE=edge, chrome=1">
	<link rel="stylesheet" href="css/main.css">
	<script src="code.js"></script>
</head>
<body>
	<div class="container">
		<div class="logo"></div>
		<div class="menu"></div>
		<div class="nav"></div>
		<div class="content"></div>
		<div class="sidebar"></div>
		<div class="footer"></div>
	</div>

</body>
</html>

Kod CSS: (po skomentowaniu linii 46 /* clear: both; */ to nie działa a w moim kodzie by działało... Dlaczego?

body{
	background-image: url(../img/escheresque_ste.png);
	/* Background pattern from Subtle Patterns */
	margin: 0;
}
.container{
	margin: auto;
	background-color: white;
	width: 900px;
	height: 500px;
}
.logo{
	background-color: grey;
	width: 900px;
	height: 60px;
}
.menu{
	background-color: black;
	width: 900px;
	height: 40px;
}
.nav{
	background-color: coral;
	width: 250px;
	height: 300px;
	float: left;
	/* display: inline-block; */
	/* margin-right: -4px; */
}
.content{
	background-color: skyblue;
	width: 450px;
	height: 300px;
	float: left;
}
.sidebar{
	background-color: teal;
	width: 200px;
	height: 300px;
	float: left;
}
.footer{
	background-color: RebeccaPurple;
	width: 900px;
	height: 100px;
	/* clear: both;	 */
}

związane z odpowiedzią na: Dlaczego poniżej divów z atrybutem float:left divy prawidłowo się układają mimo braku atrybutu clear:both?

komentarz zamknięcia: Jeden temat omawiany w jednym wątku