CSS padding-left
La proprietà CSS3 padding-left imposta la spaziatura interna a sinistra
La proprietà padding-left in CSS3 è utilizzata per aggiungere spazio interno tra il bordo sinistro dell’elemento e il suo contenuto. È particolarmente utile per regolare l’allineamento del testo o di altri elementi all’interno di contenitori.
Sintassi
Significato dei valori principali:
-
lunghezza: imposta uno spazio specifico sulla sinistra dell’elemento. Esempi:
15px,2em,5%. -
percentuale (%): calcolata rispetto alla larghezza del contenitore padre.
-
valori negativi: non sono ammessi. Inserire valori negativi genera risultati inattesi.
Esempio proprietà: padding-left
Codice Esempio: padding-left
.padding-left-example {
background-color: #6a5acd;
color: white;
font-size: 20px;
padding-left: 40px;
padding-top: 20px;
padding-bottom: 20px;
padding-right: 20px;
border: 2px solid #333;
border-radius: 6px;
width: 70%;
text-align: left;
margin: auto;
}
Contenuto Esempio: padding-left
Esempio di utilizzo di padding-left
In questo esempio, padding-left viene utilizzato per aggiungere spazio interno sul lato sinistro dell’elemento:
CSS e HTML per l'elemento con padding-left:
<style>
.padding-left-example {
background-color: #6a5acd;
color: white;
font-size: 20px;
padding-left: 40px; /* Spazio interno a sinistra */
padding-top: 20px;
padding-bottom: 20px;
padding-right: 20px;
border: 2px solid #333;
border-radius: 6px;
width: 70%;
text-align: left;
margin: auto;
}
</style>
<div class="padding-left-example">
Elemento con padding-left di 40px
</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.
Supporto Browser
IP: 216.73.216.214
