Grazie del suggerimento!
Ho provato questo:
codice HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
body{
width:960px;
margin: 0px auto;
}
img:nth-child(odd){
float: left;
margin-right:20px;
}
img:nth-child(even)
{
float:right;
margin-right:20px;
}
p {
text-align: justify;
}
p:nth-child(even)
{
float:right;
width:50%;
}
p:nth-child(odd)
{
float:left;
width:52%;
}
</style>
</head>
<body>
<div>
<img src="niko20-1.jpg" alt="niko20-1.jpg" (43086 byte) height="298" width="448" />
<p>Niko Romito, cuoco a tre stelle e ormai famosissimo, recentemente insignito a Madrid come migliore chef d’Europa, è stato intervistato da Anna Berghella, avvocato, consorte del nostro presidente Vittorio Masci, e da Massimo Di Cintio, giornalista enogastronomico.</p>
<p>Niko ci ha raccontato dei suoi inizi, alla morte del padre, quando era studente di Economia e Commercio e pensava di rivendere il ristorante paterno a Rivisondoli, non sapendo niente di cuicna e non essendovi allora, nel 1999, una cultura della cucina e della figura del cuoco, come oggi, per merito della televisione, che di solito anticipa i tempi e le tendenze.</p>
<img src="niko20-2.jpg" alt="niko20-2.jpg" (55655 byte) height="448" width="432" />
</div>
</body>
</html>
Purtroppo, se non fisso le percentuali del testo, i testi vanno fuori o non si affiancano. Penso che ci sia un modo per automatizzare gli spazi, visto che le mie foto non hanno sempre le stesse dimensioni e possono essere verticali e orizzontali. Le foto, che non si vedono, sono le prime due di questa pagina:
http://rotarysulmona.altervista.org/nikoromito20.html
che fa uso di tabelle, ma forse è lenta e antiquata. Grazie ancora per l'aiuto e buon weekend!
Originariamente inviata da
KillerWorm
Ciao e benvenuto, in linea generale potresti usare
:nth-child() col valore
odd oppure
even in modo da selezionare gli elementi dispari o pari. Questi elementi devono chiaramente essere fratelli, cioè essere tutti figli di uno stesso genitore; potresti usarlo magari per i
div contenitori, se questi stanno allo stesso livello, e selezionare quindi la relativa immagine a cui andrai ad applicare il
float.
Senza vedere come hai impostato il tutto non posso essere più preciso. Fai magari qualche prova, se poi non riesci sarebbe utile postare il link della pagina o un esempio su un playground o un estratto del relativo codice HTML.
Buon proseguimento
Rispondi quotando