Visualizzazione dei risultati da 1 a 2 su 2

Discussione: Barra di navigazione

  1. #1

    Barra di navigazione

    Buon giorno forum.

    Sono uno sviluppatore web alle prime armi (professionalmente parlando) e sto cercando di imparare qualcosa di più sullo stile "pure-CSS" (senza usare tabelle per la formattazione della pagina) e di capire se effettivamente può essere una buona idea nei suoi vari aspetti (pro e contro)

    Nel costruire un mio semplice sito personale, quindi, mi sono concesso il lusso di crearne anche una versione "CSS-only"

    L'url del sito è in firma, mentre la versione "solo CSS" si trova all'indirizzo

    http://www.larianaweb.com/css%20only...erimentale.asp

    Il problema è la barra orizzontale di navigazione (quella blu con i pulsanti azzurri, per intenderci ), che non riesco ad ottenere in modo uniforme nei vari browsers.

    Mentre in IE6 è accettabile, in Mozilla è inguardabile (con i pulsanti che si sovrapongono parzialmente...) e in NN viene resa bene o malissimo a seconda delle dimensioni settate per il testo (il che non dovrebbe essere).

    Non ho ancora avuto il coraggio di guardare la pagina con altri browsers

    La parte del CSS che riguarda la barra è:

    codice:
    #barra {
    position: absolute;
    top: 100px;
    left: 0;
    width: 100%;
    height: 27px; 
    background-image: url('../../images/navbg.gif');
    }
    
    #navcontainer
    {
    position: absolute;
    top: 1px;
    left: 161px;
    height: 27px;
    margin: 0 auto;
    font-family: verdana, serif;
    font-size: 0.8em;
    text-transform: lowercase;
    }
    
    ul#navlist
    {
    font-size: 0.8em;
    list-style: none;
    padding: 0;
    margin: 0 auto;
    width: 83%;
    }
    
    ul#navlist li
    {
    display: block;
    float: left;
    width: 16%;
    margin: 0;
    padding: 0;
    }
    
    ul#navlist li a
    {
    text-align: center;
    display: block;
    width: 100%;
    padding: 0.5em;
    border-width: 1px;
    border-color: #ffe #aaab9c #ccc #fff;
    border-style: solid;
    color: #ffffff;
    text-decoration: none;
    background: #4477dd;
    }
    
    ul#navlist li a:hover, ul#navlist li#active a:hover
    {
    text-align: center;
    color: #ffffff;
    background: transparent;
    border: none;
    margin: 1px;
    }
    ... c'è poco da ridere, è la prima volta che ne faccio una!

    Consigli?

    Grazie a tutti in anticipo.

    Marco
    E' nato www.lombardiamotori.it

    www.universocase.it: il primo portale italiano di annunci immobiliari gratuiti e autogestiti!

  2. #2
    Buon pomeriggio, ormai.........


    E' nato www.lombardiamotori.it

    www.universocase.it: il primo portale italiano di annunci immobiliari gratuiti e autogestiti!

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.