Visualizzazione dei risultati da 1 a 5 su 5
  1. #1
    Utente di HTML.it L'avatar di moonba
    Registrato dal
    Jun 2007
    Messaggi
    649

    immagini di liste e css

    ciao a tutti,avrei una domanda da chiedere anche se penso di non riuscire a risolvere il problema unicamente attraverso i css e quindi di dover cambiare 'strada'.
    Premetto che è l'unica soluzione che posso adottare.
    Ho un 'messaggio d'errore' che viene "sparato" ad esempio quando l'utente è sbagliato,o è una stringa vuota, cliccando sulla pulsante di una pagina di login.
    questo messaggio d'errore è inserito in html dal programma di sviluppo in una lista non ordinata.
    io posso solo intervenire sul css,così volevo che questo messaggio d'errore avesse anche un'immagine .
    quindi ho inserito nella proprietà style type image un immagine.

    il problema è che questa immagine si vede ancora prima di cliccare sul pulsante,e poi correttamente insieme al messaggio d'errore quando viene cliccato.
    c'è un modo di risolvere unicamente via css questo problema in modo che questo messaggio d'errore venga visualizzato insieme all'immagine solo dopo aver premuto il pulsante?
    Spero di aver spiegato il problema,ringrazio anticipatamente.

  2. #2
    Utente di HTML.it L'avatar di emnlmn
    Registrato dal
    Oct 2008
    Messaggi
    263
    Si, secondo me puoi.
    Probabilmente ho pochi dettagli per offrirti una soluzione funzionante al 100%, ma provo comunque a spiegarti quello che ho in mente.

    Intanto il codice:
    codice:
    #
    #CSS
    #
    
    ul { list-style:none; }
    
    ul li {
    	background:url(link/immagine.png) transparent 0 0 no-repeat;
    	text-indent:(x)px;
    }
    
    
    #
    #HTML
    #
    <ul>[*][/list]
    Come puoi vedere è pittosto semplice, a patto che il list item sia VUOTO prima dell'inserimento del messaggio.
    In pratica, al posto del marcatore di lista, impostato tramite list-style-image, puoi usare un immagine di sfondo impostata tramite background.
    In questo modo quando il[*] è vuoto l'immagine non sarà visualizzata (ovviamente se tutte le dimensioni sono lasciate su auto) mentre quando sarà inserito del testo, grazie a text indent, l'immagine sarà mostrata a sinitra, con il testo correttamente spostato per lasciare il giusto spazio.
    Attenzione, non usare padding-left su[*] altrimenti l'immagine sarà mostrata sempre.


  3. #3
    Utente di HTML.it L'avatar di moonba
    Registrato dal
    Jun 2007
    Messaggi
    649
    la soluzione che per ora ho messo,sfrutta proprio la proprietà background-image...ho fatto una cosa simile alla tua però è impostata sul ul,perchè non so se riesco ad intervenire sul LI.
    il problema è che la classe che in automatico viene utilizzata dal sw e che io vado a definire viene attribuita al tag UL,è un modo di implementare i css un pò particolare,cioè adattato e automatizzato da quel programma e io non ho molta autonomia.


    se ci sono altri suggerimenti...

    ringrazio

  4. #4
    Utente di HTML.it L'avatar di emnlmn
    Registrato dal
    Oct 2008
    Messaggi
    263
    sinceramente non sono riuscito a capire...

  5. #5
    Utente di HTML.it L'avatar di moonba
    Registrato dal
    Jun 2007
    Messaggi
    649
    ..che la soluzione da te proposta è simile a quella che momentaneamente ho messo,solo che la classe che vado a definire viene applicata al tag ul.quindi quella che tu hai definito nel tag li con l'immagine di background è inserita nel ul.

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.