centrare il contenuto di un div display:block

**Piccy** · 20-04-2007, 14:17

Ciao a tutti.
Volevo chiedervi una cosa che non mi riesce: ho questo codice:

.photos {float:left; margin-right:10px; margin-bottom:10px; }
.photos a {display:block; width:107px; height:70px; padding:10px; border:1px solid #c7cbd8;}
.photos a:hover {border:1px solid #cf0202;}

in pratica sono blocchetti di testo che si flottano, che contengono immagini linkate.
Io vorrei che ogni immagine stesse al centro del box photos, ma non ci riesco. Ho provato a mettere text-align:center da tutte le parti, ma non ho trovato la soluziopne. Da qualche parte ho letto che il display:block allinea tutto a sinistra.. COme posso fare ad allineare il contenuto al centro?

**gra-fichetto** · 20-04-2007, 14:27

Dai una lettura qui.

**Piccy** · 20-04-2007, 14:36

Ho provato a guardare, ma mi sembra che non ci sia la soluzione per quello che mi serve.. io devo centrare il contenuto del div (un'immagine) orizzontalmente all'interno del suo boxettino.. e le immagini non sono sempre larghe uguali...

**gra-fichetto** · 20-04-2007, 15:07

Scusami.
Questo dovrebbe andar bene

**Piccy** · 20-04-2007, 15:26

non funziona...
negli esempi che mi hai dato non usano il display:block nell'a.. io temo che sia proprio quello che non mi permette di centrare l'immagine...

**gra-fichetto** · 20-04-2007, 15:43

Originariamente inviato da Piccy
non funziona...
negli esempi che mi hai dato non usano il display:block nell'a.. io temo che sia proprio quello che non mi permette di centrare l'immagine...

Potrei essere smentito ma è probabile...

**Piccy** · 20-04-2007, 15:45

e non c'è una soluzione? anche togliendo il display:block magari...
basta che il link comprenda tutto il blocco del div... come posso fare?

**gra-fichetto** · 20-04-2007, 16:46

Scusa per il ritardo.
E se provassi una soluzione del genere?

Il codice

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-2" />

<link rel="stylesheet" href="stile.css" type="text/css" />
</head>
<a href="#">
<span>[img][/img]</span>
<span>asdjhaksjdh asjda jad ajhkjh sjadh akjdh kh</span>
</a>

<body>
</body>
</html>

Il css

codice:

a{
	float: left;
	display: block;
	width: 20%;
	border: 1px solid red;
	margin: 0;
	padding: 5px
}
span img{
	display: block;
	margin: 0 20%
}

Testato su Firefox 2.x, IE 6 e Opera 9. Non ho IE7 a disposizione in questo momento.

**Piccy** · 20-04-2007, 17:05

Ho provato. funziona però le immagini sono di larghezza troppo differente, e quindi non stanno in mezzo tutte... grazie lo stesso x l'aiuto!

Discussione: centrare il contenuto di un div display:block

Strumenti discussione

Ricerca discussione

Visualizza

centrare il contenuto di un div display:block

Permessi di invio