Salve.
Impostando in un div
ottengo la spaziatura che desidero fintanto che vado a capo con uncodice:line-height: 100%
.
Però capita che il rigo vada a capo perché è finita la larghezza del div... In tal caso come posso fare per andare a capo come se line-height non ci fosse?
Caro Gas75,
ti scrivo questa mia per consigliarti di indicare anche l'html usato quando poni una questione,
in quanto il solo css non ci dice niente se non è messo in relazione alla struttura dei tag e al doctype usato, talvolta (per esempio in caso di immagini) sarebbe gradito anche un link a pagina che ripoduca l'effetto.
Ma soprattutto dovresti spiegare bene cosa vuoi ottenere, visto che spesso si possono applicare tecniche differenti.
Giusto, avevo limitato il codice poiché mi pare strano che quella funzione non distingua l'andare a capo impostato da me da quello dovuto alla fine della riga...
Ecco cmq le parti d'intestazione della pagina...
Il css con i "pezzi" che servono allo scopo...codice:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
E l'html che li riguarda...codice:p { color: #ffffff; font-family: Arial, Helvetica; font-size: 10px; } div#menu { position: absolute; top: 112px; left: 0px; bottom: 20px; float: left; width: 140px; text-align: center; line-height: 100%; background-color: #000000; } div#destro { position: absolute; top: 112px; left: 840px; bottom: 20px; float: right; width: 140px; height: auto; min-height: 300px; text-align: center; line-height: 100%; background: #000000; overflow: auto; }
Vorrei che l'impostazione di line-height funzionasse solo se trova uncodice:<div id="menu"> <div style="background:#c00000; color:#ffffff; font-family:Arial,Helvetica; font-size:16px;">Menù</div> LINK LINK LINK LINK</p></div> <div id="destro"> <div style="background:#c00000; color:#ffffff; font-family:Arial,Helvetica; font-size:16px;">Titoli</div> 1 2 3 4</p></div>
e non quando la scritta continua a capo perché è finito il rigo.
se assegni un line-height del 100% significa che l'altezza del rigo sarà eguale a quella dell'elemento contenitore. Se in un div alto 300px hai un line-height del 100% l'altezza del rigo sarà 300 pixel, e il testo ogni volta che andrà a capo sarà distanziato in base al line-height. Guardando il tuo html e provando a capire cosa devi fare, ipotizzando che tu debba ottenere un qualche effetto coi link del menu: 1. puoi assegnare ai link un display:block e specificarne l'altezza in modo che vadano a capo senza br; 2. impostare un margin-bottom in maniera che siano distanziati fra loro per quanto ti serve.
In altri termini mi serve una cosa del genere...
1° link, su un rigo
2° link, su due righe e quindi
va a capo senza "salti"
3° link, su un rigo
4° link, su un rigo...
I link sono definiti per tutta la pagina, a me serve che solo in quel div abbiano quella spaziatura.
Ho provato a mettere margin-bottom nello stile del paragrafo che contiene i link, ma l'effetto è strano: qualunque valore dia al margin-bottom, me lo mostra sempre alla stessa distanza, che comunque è diversa rispetto a quando non specifico alcun margin-bottom.
Assegna ai link un display:block (eventualmente assegna una larghezza, altimenti sarà pari a quella del loro contenitore), via il line-height e aggiungi un margin-bottom ai link stessi
Display: block è perfetto per quell'elenco di link, però... così facendo ovunque trova un link va a capo perché ho definito gli "a" globalmente nel css.
Da qualche parte devo avere scritto come fare per specificare un tipo di oggetti (i link in questo caso) dentro uno specifico div togliendoli dal flusso globale. Se lo trovo, il problema è finalmente risolto.
Inoltre devo cercare di non formattare i link nella pagina html (il margin-bottom), perché ho degli elenchi di link anche piuttosto lunghi (una sorta di indice analitico delle voci contenute nel div main...).
nel codice postato in altra discussione puoi vedere come sono definiti i link, con selettori discendenti: #menu a {} eccetera (così la formattazione interessa solo i link all'interno del contenitore specificato). Se ti risulta difficoltoso fare così, puoi creare una classe per i diversi link (lo svantaggio in questo caso è di dover ripetere la classe per tutti i link, ma non avrai risultati non voluti per interferenze di altre impostazioni)
Devo provare coi selettori discendenti.
Grazie della dritta.
Permessi di invio
Rispondi quotando