Cześć, jestem nowy na forum, Robię stronę internetową i mam problem. Dałem do znacznika img stył float: left; Rozumiem, że dzięki temu zdjęcie powinno się ustawić na lewo od akapitu, a się nie ustawia. Gdy wejde w devtools i najadę na akapit to akapit obejmuje także zdjęcie. Dodatkowo zawartość akapitu wychodzi poza margines.
kod CSS
body{
background: url("tło.jfif");
background-size: 100%;
background-attachment: fixed;
}
div.container{
width: 1040px;
margin: auto;
padding: 0 15px;
}
div.main-content{
width: 70%;
float: left;
}
div.sidebar{
width: 30%;
float: left;
}
div.content{
overflow: auto;
}
article, footer, aside header, section{
display: block;
}
article{
margin-right: 15px;
margin-bottom: 15px;
}
header{
margin-bottom: 15px;
}
footer{
margin-top: 15px;
}
img{
float:left;
}
html
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="utf-8"/>;
<meta name="destription" content"Nasza firma zajmuje się produkcją i dystrubucją własnych wyrobów o najwyższej jakości"/>
<link rel="stylesheet" href="Style.CSS">
<title>Quick Sparrow</title>
</head>
<body>
<div class="container">
<header>
<h1>
Firma Quick Sparrow od lat dba o wyroby najwyższej jakości. Do zaoferowania mamy...
</h1>
</header>
<div class= "content">
<div class= "main-content">
<section>
<article>
<h2>nagłówek 1</h2>
<img src="powerbank.png">
<p>
bleblenbelenjefnjanejnfajwnrnrunwuryrwbkbwykgrfyiwgrfywuihrwilwbleblenbelenjefnjanejnfajejnfajwnrnrun
uryrwbkbwykgrfyiwgrfywuihrwilwbleblenbelenjefnjanejnfajwnrnrunwuryrwbkbwykgrfyiwgrfywuihrwilwbleblenbelenje
fnjanejnfajwnrnrunwuryrwbkbwykgrfyiwgrfywuihrwilwbleblenbelenjefnjanejnfajwnrnru
nwuryrwbkbwykgrfyiwgrfywuihrwilwbleblenbelenjefnjanejnfa
wnrnrunwuryrwbkbwykgrfyiwgrfywuihrwilwbleblenbelenjefnjanejnfajwnrnrunwuryrwbkbwykgrfyiwgrfywuihrwilw
</p>
</article>
<article>
<h2>nagłówek 2</h2>
<img src="rzeźba.png">
<p>
jkafnfjsfakngggggfsssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss
ssaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
</p>
</article>
</section>
</div>
<div class="sidebar">
<aside>
<h2>Kilka słów o nas</h2>
<p>Ogólnie jesteśmy super. Firme prowadzimy od 53 lat. Jeśteśmy zawsze dokładni w tym co robimy. Przede wszystkim dbamy o jakość.</p>
</aside>
</div>
</div>
<footer>Wszelkie prawa zastrzeżone ©</footer>
</div>
</body>
</html>
Przy okazji pisze w Notepad++. Możę w tym leży problem.
Dziękuję za każdą udzieloną pomoc
Maverick
