CSS margin-right
La proprietà CSS margin-right imposta il margine destro di un elemento (CSS3)
La proprietà margin-right
in CSS3 regola lo spazio esterno a destra di un elemento HTML. È spesso usata per creare distanze orizzontali tra elementi o dal bordo del contenitore.
Sintassi
Significato dei valori principali:
lunghezza: Valore fisso come
15px
,1em
,2rem
che definisce lo spazio a destra.percentuale: Percentuale relativa alla larghezza del contenitore padre, es.
margin-right: 10%;
.auto: Il browser calcola automaticamente il margine. Utile in alcuni layout flessibili.
inherit: Eredita il valore dal genitore.
initial / unset: Ripristina il valore iniziale o annulla i valori impostati.
Esempio proprietà: margin-right
Codice Esempio: margin-right

.margin-right-container {
background-color: #f0f0f0;
padding: 20px;
}
.margin-right-box {
background-color: #50a14f;
color: white;
padding: 15px;
margin-right: 40px;
font-size: 18px;
border-radius: 5px;
display: inline-block;
}
Contenuto Esempio: margin-right
Esempio di utilizzo della proprietà margin-right
In questo esempio, l'elemento ha un margine destro che lo distanzia dal bordo destro del contenitore:
margin-right: 50px;
CSS e HTML per l'esempio con margin-right
:
<style>
.margin-right-container {
background-color: #fdf6e3;
border: 2px dashed #50a14f;
}
.margin-right-box {
background-color: #e06c75;
color: white;
padding: 15px;
margin-right: 50px; /* Margine destro */
font-size: 18px;
border-radius: 5px;
}
</style>
<div class="margin-right-container">
<div class="margin-right-box">
Elemento con margin-right: 50px;
</div>
</div>
Leggenda Proprietà:

Note:
Le indicazioni dei Browser supportati sono superate grazie alla loro costante evoluzione, si consiglia di verificare la compatibilità dei vari browser eseguendo il test cliccando qui sotto.