MICHELEPISANI.IT
 

Posizionare un'immagine al centro di una pagina o di un contenitore

Centrare un'immagine orizzontalmente

CSS - Centrare un'immagine orizzontalmente in un contenitore
Giugno 09
07:562014

Sfuttando 3 semplici proprietà dei CCS standard è possibile centrare orizzontalmente un'immagine all'interno di una pagina web o di un contenitore.

Le proprietà utilizzate sono: display, margin e text-align; quest'ultima serve a garantire la compatibilità con Internet Explorer rendendo così il codice cross-browser. E' possibile visualizzare un esempio immediato del risultato in Fig. 1


centrare orizzontalmente un'immagine
Fig .1 - Immagine centrata orizzontalmente nel contenitore principale

Il codice utilizzato per ottenere l'effetto:

<style type="text/css">
  .centro {
      display:block;
      margin:0px auto;
      text-align:center;
      }
</style>
<img src="nome_immagine.jpg" class="centro" alt="" />

Tags
Condividi

Autore

Michele Pisani

Michele Pisani

Ho uno spiccato orientamento al problem-solving, se è troppo facile non mi diverto :)
Credo nella volontà e nel cambiamento perchè hanno fatto della mia passione il mio pane quotidiano.
Se devo descrivermi con una sola parola direi... "Concretezza", la mia stretta di mano è una garanzia.

0 Commenti

Non ci sono commenti

Nessuno ha ancora commentato questo articolo, fallo tu per primo!

Scrivi un Commento

Scrivi un Commento

Il tuo indirizzo email non sarà pubblicato.
I campi contrassegnati da un * sono obbligatori

Articoli e Argomenti correlati

Categorie popolari

Iscriviti alla mia newsletter

La tua e-mail con me sarà al sicuro.
Non fornirò mai le tue informazioni a nessuno!

Ultimi commenti

Michele Pisani

Ciao alessandro,
questa regex dovrebbe fare al caso tuo:

alessandro

ciao sto cercando una regex per numeri interi o decimali, positivi o negativi; la tua regex mi pare …

Michele Pisani

Ciao Nicola,
ti riferisci per caso alla situazione di gianluigi?
In tutti i casi la via …

Nicola

Ciao Michele, mi trovo nella medesima situazione in cui si trovava Gianluca un anno fa. Sei poi …