0
この画像はテキストの隣にあるように追加しましたが、水平線とテキストを追加しようとすると、画像とテキストが含まれていますが、画像はそのままです。 Screenshot浮動小数点：左の画像には他の要素が含まれています
HTML：
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>Sími portfólio</title>
<link rel="stylesheet" type="text/css" href="pokus1.css" />
</head>
<body>
<div id="hlavni">
<h1 id="nadpis"> XXXXXXXXXXXXXX </h1>
<p id="text"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
In dapibus augue non sapien. Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Aliquam ornare wisi eu metus.
Duis viverra diam non justo. Etiam posuere lacus quis dolor. Pellentesque arcu. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Nulla est.
Phasellus faucibus molestie nisl. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Nam sed tellus id magna elementum tincidunt.
Fusce tellus odio, dapibus id fermentum quis, suscipit id erat. Integer tempor. Pellentesque arcu. </p>
</div>
<img src="tučík.png" alt="prasátko" id="prasatko">
<hr>
<p> . Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Aliquam ornare wisi eu metus.
Duis viverra diam non justo. Etiam posuere lacus quis dolor. </p>
</div>
</body>
</html>
CSS：あなたの助けを
body {
display:block;
width: 800px;
margin-top: 10px;
margin-left: 550px;
margin-right: 550px;
background-image: url("pozadi.png");
overflow: hidden;
}
#hlavni {
clear: both;
overflow: hidden;}
#nadpis {
display:block;
background-color: grey;
font-size: 50px;
font-family: Garamond;
font-style: italic;
padding: 8px;
overflow: hidden;}
#text {
line-height: 30px;
font-size: 20px;
float: right;
clear: right;
width: 55%;
overflow: hidden;
}
#prasatko {
height: 300px;
width: 300px;
position: relative;
right: 60px;
bottom: 50px;
float: left;
clear: left;
overflow: hidden;
}
おかげで、私が試したオーバーフロー：隠されたまたはクリア：何もなく、両方が終了後