Vai al contenuto
PLC Forum


layout_template


GIUSEPPE IAN

Messaggi consigliati

Ciao a tutti, ho bisogno di un vostro aiuto per capire come modificare questo codice, cercando di capire il concetto.

 

<html>
<head><title>esecitazione modulo 5 - template a 3 colonne flottanti - layout a larghezza
fissa</title>
<style type="text/css">
#wrapper { width: 750px; position: relative; margin: auto; border: solid 2px #9370D8; backgroundcolor:
silver;}
#header { background-color: #E6E6FA; padding: 15px; text-align: center; font-family: "french
script mt"; font-size: 18pt; width: 720px; height: 50px; }
#link { background-color: silver; width: 150px; height; 100px; float: left;
width: 175px; text-align: center; }
#main { background-color: #E6E6FA; float: left; width: 400px; text-align: justify;}
#second { background-color: silver; float: left; width: 175px; text-align: justify;}
#footer { clear: both; padding: 15px; background-color: silver; text-align: center; }
.link1 {text-weight: bold; border: groove 2px silver; width: 120px; height: 30px; float: left;
padding: 10px; margin 10px; }
h4 {text-align: center; }
#titolo {text-align: left; font-style: italic; padding: 10px; color: #6A5ACD; }
body { margin: 0; padding: 0; background-color: #B0C4DE;}
p { padding: 0px 8px; }
</style>
</head>
<body>
<div id="wrapper">
<h4 id="titolo">Favole di Fedro</h4>
<div id="header" align="center">
<a class="link1" href="http://elearning.areasoftwarecpu.it"> Home Page </a>
<a class="link1" href="http://elearning.areasoftwarecpu.it"> Database favole </a>
<a class="link1" href="http://elearning.areasoftwarecpu.it"> Database autori </a>
<a class="link1" href="http://elearning.areasoftwarecpu.it"> Contatti </a>
<a class="link1" href="http://elearning.areasoftwarecpu.it"> Pubblicazioni </a>
</div>
<div id="link">
<h4>Altre storie</h4>
<p>
<a href="http://www.ilnarrastorie.it/Fedro/Le.rane.chiesero.un.re6.html">Le rane che chiesero un
re</a> <br/>
<a href="http://www.ilnarrastorie.it/Fedro/Il.cane.vecchio.e.il.cacciatore5.html">Il cane vecchio e il
cacciatore</a> <br/>
<a href="http://www.ilnarrastorie.it/Fedro/Il.cane.fedele27.html" >Il cane fedele</a> <br/>
<a href="http://www.ilnarrastorie.it/Fedro/Il.toro.e.il.vitello4.html" >Il toro e il vitello</a> <br/>
<a href="http://www.ilnarrastorie.it/Fedro/Le.rane.e.il.Sole10.html" >Le rane e il sole</a> <br/>
<a href="http://www.ilnarrastorie.it/Fedro/Il.lupo.e.la.gru12.html" >Il lupo e la gru</a><br/>
<p>
</div>
<div id="main">
<h4>Il lupo e l'agnello</h4>
<p>
Allo stesso rivo erano giunti il lupo e l'agnello spinti dalla sete; in alto stava il lupo e molto più in
basso l'agnello. Ed ecco che il predone, stimolato dalla sua gola maledetta, tirò fuori un pretesto per
litigare. "Perché", disse, "mi hai intorbidato l'acqua proprio mentre bevevo?". E il batuffolo di lana,
pieno di paura, risponde: "Scusa, lupo, come posso fare quello che recrimini? È da te che scorre giù
l'acqua fino alle mie labbra". Respinto dalla forza della verità, il lupo esclama: "Sei mesi fa hai
sparlato di me". L'agnello ribatte: "Io? Io non ero ancora nato". "Perdio", lui dice, "è stato tuo padre
a sparlare di me". E così lo abbranca e lo sbrana, uccidendolo ingiustamente. Questa favola è scritta
per quegli uomini che opprimono gli innocenti con false accuse.
</p>
<h4>La volpe e la cicogna</h4>
<p>
La volpe, così si racconta, invitò per prima la cicogna a cena e le pose su un piatto un guazzetto,
tutto liquido, che la cicogna, pur desiderosa di cibo, non poteva in alcun modo gustare. E questa,
avendo invitato a sua volta la volpe, le mise davanti una fiasca piena di cibo tritato: vi caccia dentro
il collo e si sazia, lei, la cicogna, ma impone alla commensale il tormento della fame. E mentre
quella lambiva inutilmente il collo della fiasca, l’uccello migratore così diceva, come sappiamo:
"Ognuno tolleri di buon animo i metodi che si è scelto".
</p>
</div>
<div id="second">
<h4>Cenni storici</h4>
<p>Fedro scrisse cinque libri di Fabulae (il titolo integrale è: Phaedri Augusti liberti fabulae
Aesopiae), ma, di esse, ne restano appena novantatré: troppo poche, in verità, data anche la limitata
estensione della maggior parte di esse, per pensare che potessero formare davvero un complesso di
cinque libri. Si sospetta, perciò, a ragione, che ogni libro (specialmente il II e il V) sia stato
sottoposto, attraverso i secoli, a tagli immeritati per ragioni didattiche e moralistiche, dal momento
che il testo di Fedro divenne, presto, lettura di scuola.
</p>
</div>
<div id="footer"> <address>Fiabe di tutti i tempi - Rivista online <br/>
Direttore responsabile - <a href="mailto:elearning@areasoftwarecpu.it">Camilla Bianchi</a><br/>
Gestione e copyright © Edizioni Online - Riproduzione vietata - Rivista autofinanziata e senza
scopo di lucro - Libera consultazione gratuita
<address></div>
</div>
</body>
</html>

Devo riuscire a far un output del genere:

https://www.dropbox.com/s/m6tq60qgak9dkfu/Esercitazione_layout_template_output.png?dl=0

Grazie.

 

Modificato: da GIUSEPPE IAN
Link al commento
Condividi su altri siti


Io vedo che il div di destra va a capo a causa della larghezza errata, se questo è il problema, correggi questa riga da:

#second { background-color: silver; float: left; width: 175px; text-align: justify;}

a:

#second { background-color: silver; float: left; width: 170px; text-align: justify;}

 

Link al commento
Condividi su altri siti

Crea un account o accedi per commentare

Devi essere un utente per poter lasciare un commento

Crea un account

Registrati per un nuovo account nella nostra comunità. è facile!

Registra un nuovo account

Accedi

Hai già un account? Accedi qui.

Accedi ora
×
×
  • Crea nuovo/a...