Jump to content
PLC Forum

GIUSEPPE IAN

layout_template

Recommended Posts

GIUSEPPE IAN

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.

 

Edited by GIUSEPPE IAN
Link to post
Share on other sites

GIUSEPPE IAN

L'output dovrebbe essere come la foto del Link.

Link to post
Share on other sites
guido

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 to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...