CSS border-inline-end-width
La proprietà CSS3 border-inline-end-width
imposta la larghezza del bordo sul lato finale logico
La proprietà border-inline-end-width
definisce quanto spesso deve essere il bordo sul lato finale in linea dell’elemento.
Questo lato si adatta alla direzione del testo: è a destra in scrittura LTR
e a sinistra in RTL
.
È parte delle proprietà logiche CSS3, progettate per il supporto completo di layout internazionali.
Sintassi
Significato dei valori principali:
thin: larghezza sottile (definita dal browser).
medium: larghezza media (valore predefinito).
thick: larghezza spessa.
<lunghezza>: qualsiasi valore CSS valido, es.
2px
,0.2em
,4mm
, ecc.
Esempio proprietà: border-inline-end-width
Codice Esempio: border-inline-end-width

.border-inline-end-width-example {
width: 80%;
padding: 20px;
border-inline-end-width: 8px;
border-inline-end-style: solid;
border-inline-end-color: #2ecc71;
background-color: #f0f9f0;
font-size: 20px;
text-align: center;
direction: ltr;
border-radius: 8px;
}
Contenuto Esempio: border-inline-end-width
Esempio di utilizzo di border-inline-end-width
Qui il bordo sul lato finale in linea ha una larghezza personalizzata:
CSS e HTML per l'elemento con border-inline-end-width
:
<style>
.border-inline-end-width-example {
width: 80%;
padding: 20px;
border-inline-end-width: 8px;
border-inline-end-style: solid;
border-inline-end-color: #2ecc71;
background-color: #f0f9f0;
font-size: 20px;
text-align: center;
direction: ltr;
border-radius: 8px;
}
</style>
<div class="border-inline-end-width-example">
Bordo largo sul lato finale (inline-end)
</div>
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.