Svojstvo shape-margin

Svojstvo shape-margin postavlja odstup oko oblika, definisanog svojstvom shape-outside. Ovo omogućava povećanje udaljenosti između oblika i teksta koji ga obilazi.

Sintaksa

selektor {
	shape-margin: vrednost;
}

Primer

Krug sa odstupom od 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;
}

Primer

Trougao sa odstupom od 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;
}

Pogledajte takođe

svojstvo shape-outside,
koje definiše oblik za obilazak
svojstvo clip-path,
koje kreira vidljivi oblik elementa
svojstvo float,
neophodno za rad shape-margin