Frage Woher kommen die Abstände?

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Nsl

Neues Mitglied
6 Mai 2020
1
0
1
27
Wisst ihr vielleicht wieso mein Bild und der Text nicht zentral in der Box ist, sondern es oben so einen großen Abstand gibt?
Bildschirmfoto 2020-05-06 um 22.45.59.png

Das ist der Code dazu:

<!DOCTYPE html>
<html>

<head>

<style>
.box {

width: 550px;

height: 50px;

padding: 40px;

}

.box:nth-of-type(1) {
border: 4px solid green;
}

.box:nth-of-type(2) {
border: 4px solid green;
}

</style>

</head>

<body>
<p>
<div class="box">
<p><img src="hund.png" alt="hahn" width="60"
height="60" style="float:left; margin-left: 20px;"/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus imperdiet, nulla et dictum interdum, nisi lorem egestas odio, vitae scelerisque enim ligula venenatis dolor. Maecenas nisl est, ultrices nec congue eget, auctor vitae massa.

</div>
</p >

<p>
<div class="box">
<p><img src="hahn.png" alt="hahn" width="60"
height="60" style="float:right; margin-left: 20px;"/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus imperdiet, nulla et dictum interdum, nisi lorem egestas odio, vitae scelerisque enim ligula venenatis dolor. Maecenas nisl est, ultrices nec congue eget, auctor vitae massa.

</div>
</p>

</body>
</html>
 

semtec

Neues Mitglied
6 Mai 2020
7
0
1
Das ist der Innenabstand, also der Abstand vom Inhalt zum Rahmen und dann ist da noch ein p-Element, das auch noch für etwas Abstand verantwortlich ist. Die p-Elemente solltest Du übrigens korrekt öffnen und schließen!