Ciao a tutti!
Vi chiedo di risolvermi un dubbio!
Mi capita una cosa che non capisco: in un template con DIV e relativo CSS.
Tipo così:
<div id="container">
<div id="header"></div>
<div id="faux">
<div id="leftcolumn"></div>
<div id="rightcolumn">
<div id="bloccotesto1"></div>
<div id="bloccotesto2"></div>
</div>
<div class="clear"></div>
</div>
<div id="footer"></div>
</div>
Dentro rightcolumn nel primo DIV bloccotesto1 c'è:
<h1>TITOLO TITOLO</h1>
<p align="left">[img]immagine.jpg[/img]testo testo testo testo testo testo testo testo testo testo testo </p>
Il testo è poco, alla destra dell'immagine. Quindi sotto il testo (a fianco dell'immagine) dovrebbe esserci un bel po' di spazio bianco e andrebbe bene così.
Subito sotto a questo codice si apre un secondo DIV bloccotesto2 che conterrà un blocco per le notizie.
Qual è il problema?
Se, come in questo caso, il testo è poco e l'immagine è alta succede che il div successivo (bloccotesto2) non viene mostrato subito sotto l'immagine - come dovrebbe essere - ma viene invece collocato subito sotto il testo. Essendoci l'align left dell'immagine, il div successivo viene anch'esso allineato alla destra dell'immagine, esattamente come il testo.
Questo non va bene e rovina di brutto la struttura.
Mi chiedo, non c'è una specie di CLEAR che evita che anche il div successivo sia allineato alla destra dell'immagine?
Per risolvere questa situazione. devo mandare a capo tante volte affinche il testo si spinga fin oltre l'immagine. In questo modo il DIV successivo si vedrà correttamente sotto l'immagine e non a fianco.
Soluzione assai poco elegante, purtroppo.
Non ho pubblicato il CSS per evitare un messaggio lughissimo.
Inserico solo:
#rightcolumn {
float: right;
width: 518px;
display: inline;
position: relative;
}
bloccotesto 1 e 2 non hanno nulla di particolare. width: auto;
Spero di essermi spiegata! Grazie.
Rispondi quotando
