• User Attivo

    Lista orizzontale con margine sinistro

    Salve a tutti!

    devo costruire una lista con visualizzazione orizzontale e tutti gli elementi della lista, che sono links, devono avere un bordo bianco.

    Il primo problema è che il primo elemento della lista non deve avere questo bordo perchè contiene una immagine.

    Il secondo problema è che i link devono essere posizionati in alto.

    Il terzo problema è che uno dei link, quello attivo, deve essere di un determinato colore.

    Vi allego il codide del CSS interessato:

    
    #tabs {
        border: 0;
        margin: 0;
        margin-bottom: 5px;
        padding: 5px;
        background-color: #231f20;
        width: 690px;
        min-height: 80px;
        } ul {
        margin: 0;
        padding: 0;
        display: inline;
        }
        
     ul li {    
        padding: 12px;
        list-style: none;
        display: inline;
        } ul li.active {
        list-style: none;
        display: inline;    
        }
    
    ```e qui l'html prodotto:
    
    

    <div id="tabs">
    <ul>
    <li ><img src="i/idee.jpg"></li><li class="active"><a href="../index.php?s=noi">.Noi</a></li>
    <li><a href="../index.php?s=progetti">.Progetti</a></li>
    <li><a href="../index.php?s=sostienici">.Sostienici</a></li>
    <li><a href="../index.php?s=comunichiamo">.Comunichiamo</a></li>
    <li><a href="../index.php?s=novita">.Novità</a></li>
    <li><a href="../index.php?s=contatti">.Contatti</a></li>
    </ul>
    </div>


  • User Attivo

    @Rinino said:

    Il primo problema è che il primo elemento della lista non deve avere questo bordo perchè contiene una immagine.

    li.primoelemento {border:0} ...prova a dare una classe al primo elemento dove azzeri il bordo (N.b. in questo caso azzera tutti i bordi...se vuoi che nasconda solo il sinistro -> border-left:0px;)

    @Rinino said:

    Il secondo problema è che i link devono essere posizionati in alto.

    In alto in che senso? vedo che tabs ha un padding di 5px anche dall'alto...forse devi vedere come posizionare la ul
    @Rinino said:

    Il terzo problema è che uno dei link, quello attivo, deve essere di un determinato colore.

    li.active {color:#000; se lo vuoi nero oppure altri}

    spero di averti aiutato...salut


  • User Attivo

    il terzo l'ho risolto...

    Scusa l'italiano maccheronico, intendevo:

    Il menu ha una certa altezza e i link sono posizionati in basso, sulla "base" diciamo...

    Grazie per la risp...