Visualizzazione dei risultati da 1 a 6 su 6
  1. #1

    elenco puntato e immagine a sinistra

    Salve,

    ho una immagine allineata a sinistra con un float left, con del testo affianco.

    Se nel testo metto un elenco puntato, i quadratini dell'elenco puntato vanno sotto all'immagine (nel senso che sono coperti dall'immagine e non che vanno a capo sotto all'immagine) e non si vedono, mentre il testo parte a filo dell'immagine stessa.
    Se si seleziona testo e immagine vedo addirittura i quadrattini sotto all'immagine.

    C'è una soluzione?

    Io ho provato con padding e margin all'ul e al li, ma firefox e explorer hanno comportamenti diversi (neccessitano di valori diversi) e soprattutto explorer ha bisogno di valori diversi se cambiano le dimensioni dell'immgine, cosa che rende difficile inserirlo in un contesto dinamico.

    Ringrazio per ogni consiglio

  2. #2
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,783
    hai provato a mettere la lista in un div suo?

    visto che queste cose dipendono anche da condizioni generali...
    potresti postare anche un po' di codice?

    ...e magari far spostare la discussione in CSS ?

  3. #3
    Ho già provato,
    tutto il testo è dentro ad un div.

    Ecco il codice comunque:


    codice:
    <div style="width: 118px;float:left; padding:3px 5px 0px 0;">
    [img]pippo.jpg[/img]
    </div>
    <div>
    	
    
    lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum</p>
    	<ul>
    		[*]lorem ipsum
    		[*]lorem ipsum
    		[*]lorem ipsum
    	[/list]
    </div>
    Grazie ancora

  4. #4

  5. #5
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,783
    Al momento è la soluzione migliore che ho trovato.
    Ha comportamento differente su IE6 e su FF2,
    nel secondo l'immagin della lista rimane al suo posto.

    codice:
     <div style="width: 118px;float:left; padding:3px 5px 0px 0; margin-right: 20px;">
    [img]pippo.jpg[/img]
    </div>
    <div>
    	
    
    lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum</p>
    	<ul style="text-indent: 1cm;">
    		<li >lorem ipsum
    		[*]lorem ipsum
    		[*]lorem ipsum
    	[/list]
    </div>

  6. #6
    La soluzione è molto buona, ma purtroppo non può essere applicata ad una situazione in cui non sai la dimensione dell'immagine, infatti se aumenti la larghezza firefox e opera sovrappongono immagine e testo.

    Grazie infinite per l'aiuto comunque, quel codice lo tengo buono per situazioni statiche.


Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.