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

    list-style-image le immagini sono lontanissime dai testi

    Ciao a tutti e buone vacanze, posto subito un link di esempio per far capire il problema

    http://www.comunicareoltre.it/client...in.php?plain=0

    Come si vede nel menu di destra, quello in grassetto per capirci, i triangolini che dovrebbero essere a destra di ciascuna voce sono molto lontani dai relativi link...

    vi posto il codice CSS

    codice:
    ul#menu2 {
        font-family: Din, Verdana, sans-serif;
    	font-weight: bold;
        font-size: 14px;
        margin: 0px;    
    	padding: 0px;
    	list-style: none;
    }
      
    ul#menu2 li {    
      
        width: 200px;
        height: 63px;
        float: left; 	
    	text-align: center;
    	background-color: #e3e3e3;
    	border-left: 1px solid #e7e7e7;
    	border-right: 1px solid #e7e7e7;
    	list-style-image: url('../images/triangle.png');
    }
      
    ul#menu2 li a {
        color: #182980;
        display: block;
        line-height: 15px;
        margin-top: 30px;
        width: 200px;
        height: 43px;
        text-align: center;
    	text-decoration: none;
    }
      
    ul#menu2 li.active, ul#menu2 li a:hover {
        color: #F9AE40;
        text-decoration: none;
    }
    Non è il mio forte quindi chiedo aiuto a voi
    Grazie a chi ad agosto vorrà starmi a sentire.
    Viviamo tutti in una palude di fango, ma alcuni di noi guardano le Stelle http://www.comunicareoltre.it

  2. #2
    Utente di HTML.it L'avatar di Experiment8
    Registrato dal
    Jun 2012
    residenza
    Milano
    Messaggi
    254
    Ciao,

    siccome non è possibile posizionare l'immagine di lista, ti consiglio di utilizzarla come background:

    codice:
    ul#menu2 li {    
        width: 180px;
        height: 63px;
        padding: 0 20px;
        float: left; 	
        text-align: center;
        background: #e3e3e3  url('../images/triangle.png') no-repeat 5px 34px;
        border-left: 1px solid #e7e7e7;
        border-right: 1px solid #e7e7e7;
    }
    Così dovrebbe posizionarsi esattamente dove vuoi.
    Se hai domande chiedi pure


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.