Mam taki oto prosty kod html
<!DOCTYPE html>
<html lang = "pl">
<head>
<title>Nord Team service</title>
<meta charset = "utf-8">
<meta name= "viewport" content="width=device-width, initial-scale=1">
<meta name= "description" content = "Ogrzewanie, wentylacja, klimatyzacja, kotły">
<link rel="stylesheet" href="stylerocco.css">
</head>
<body>
<div id = "szczyt">
<div style = "float : left"><img src = "logo_rocco.jpg" alt = "Nord Team service"/></div>
<div class = "przycisk-nawigacji" ><a href = "nowosci.html" >NOWOŚCI</a></div>
<div class = "przycisk-nawigacji" ><a href = "nowosci.html" >SERWIS</a></div>
<div class = "przycisk-nawigacji"><a href = "nowosci.html" >SKLEP</a></div>
<div class = "przycisk-nawigacji"><a href = "nowosci.html" >KONTAKT</a></div>
</div>
</body>
</html>
I kod css :
body {
background-color : gray;
}
#szczyt {
width : 90%;
margin : 0 auto;
height : 63px;
}
.przycisk-nawigacji
{
max-width : 150px;
height : 62px;
color : black;
text-align : center;
font-size : 21px;
line-height : 62px;
background-color : #3c5a8e;
float : left;
}
a {text-decoration : none;
color : black;
}
I divy zachowują się tak jakby chciały się maksymalnie ścisnąć a nie rozszerzyć do wskazanych 150px. Dlaczego?
