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

    Chiedo piccolo aiuto grafico per un menu CSS

    Salve a tutti, mi chiamo Cristian.

    Sto costruendo un menu orizzontale utilizzando il CSS, come file ho un semplicissimo menu in html, il suo relativo css e alcune immagini che lo compongono.

    Il risultato è soddisfacente, ma nel primo pulsante a partire da sinistra non c'è quella barra sottile che divide gli altri pulsanti l'uno dall'altro.

    Posto qui il codice HTML e CSS:

    codice:
    <div id="menu"> 
        <ul id="menu-interno"> [*]Benvenuto [*]Testimonianze[*]Iscriviti [*]Chi siamo [/list]
    </div>

    codice:
    #menu {
    	position:relative;
    	height:45px;
    	background-image:url(images/bg_white.png);
    	background-position:bottom;
    	background-repeat:repeat-x;
    	margin:0 0 25px 0;
    	clear:both;
    	border-bottom:1px solid #ccc;
    	top:50px;	
    }
    	
    #menu ul#menu-interno{
    	margin:0 auto;
    	padding: 3px 0px 0px 0px;
    	width:544px;
    }
    
    #menu ul#menu-interno li{
    	float:left;
    	height:45px;
    	font-family: Arial, sans-serif;
    	font-size:14px;
    	margin:0 !important;
    	line-height:45px;
    	color:black;
    	position:relative;
    }
    
    #menu ul#menu-interno li a{  
    	font-weight: bold; 
    	color: black; 
    	padding: 12px 25px 12px 24px; 
    	background: url(images/bg_white.png) repeat-x 100% 0; 
    	background-position: 100% 0px; 
    	text-decoration: none;
     }
    
    #menu ul#menu-interno li a:hover{
    	background-position: 100% -40px; 
    	color: black;	
    }
    Metto anche le immagini:

    - Immagine utilizzata nel CSS:

    Questa è quella originale


    Questa è quella modificata, tale da avere lo stesso bordo anche sul lato sinistro



    - Risultato finale:



    Domanda: come faccio a far sì che sia presente quel sottile bordo anche sul lato sinistro del primo pulsante ?

    Ho provato anche a creare un pulsante vuoto, e il bordo salta fuori, ma mi occupa spazio inutilmente nella barra, spostandomi tutto più a destra: colpa del padding. Qualcuno riuscirebbe a farmi vedere come forzare il padding a 0 però solo per quel pulsante vuoto ? Caso mai attraverso una class o un'id specifico solo per questo caso.


    Grazie mille in anticipo a tutti,
    Cristian.

  2. #2
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    Se crei uno stile per la prima voce elenco assegnando anche a quella l'immagine di sfondo posizionata a sinistra?

  3. #3
    Originariamente inviato da Prill
    Se crei uno stile per la prima voce elenco assegnando anche a quella l'immagine di sfondo posizionata a sinistra?
    Ci ho pensato, ma non sono molto esperto. Il codice che ho lo ho preso da un menu già pre-esistente e l'ho modificato al caso mio.

    Se saresti così gentile da potermi far vedere il codice adatto te ne sarei grato.

    Cristian.

  4. #4
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    Titolo che non da` alcuna informazione sul problema. A norma di regolamento devo chiudere.

    Riproponi dopo aver letto il regolamento.
    Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
    No domande tecniche in messaggi privati

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 © 2026 vBulletin Solutions, Inc. All rights reserved.