Eigenschaft shape-margin
Die Eigenschaft shape-margin legt einen Abstand um eine Form fest,
die durch die Eigenschaft shape-outside definiert ist.
Dies vergrößert den Abstand zwischen der Form und dem sie umfließenden Text.
Syntax
Selektor {
shape-margin: Wert;
}
Beispiel
Ein Kreis mit einem Abstand von 20px:
<div class="shape"></div>
<p>
some long text
</p>
.shape {
width: 150px;
height: 150px;
float: left;
shape-outside: circle(50%);
shape-margin: 10px;
clip-path: circle(50%);
background: #3498db;
}
p {
width: 500px;
text-align: justify;
}
:
Beispiel
Ein Dreieck mit einem Abstand von 1em:
<div class="shape"></div>
<p>
some long text
</p>
.shape {
width: 150px;
height: 150px;
float: left;
shape-outside: polygon(0% 0%, 100% 50%, 0% 100%);
shape-margin: 1em;
clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
background: #e74c3c;
}
p {
width: 500px;
text-align: justify;
}
:
Siehe auch
-
die Eigenschaft
shape-outside,
die die Form für den Textfluss definiert -
die Eigenschaft
clip-path,
die die sichtbare Form des Elements erzeugt -
die Eigenschaft
float,
die für die Funktion von shape-margin erforderlich ist
