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

    Problema con il ridimensionamento del browser

    Salve a tutti.
    Cercando qua e la ho trovato alcune indicazioni su come realizzare un menù dropdown.
    Il menù principale e il sottomenù utilizzano delle immagini ad-hoc realizzare per dare del colore e per dare un effetto più tondo agli angoli del suddetto menù e sottomenù.

    Ho avuto qualche problema non di poco conto quando, per puro caso, ho ridimensionato la pagina del browser.
    Sorpresa, non riuscivo a vedere più le ultime voci del mio menù.

    Di seguito vi posto il css e se volete, magari per capire meglio il problema, vi posso indicare il link dove ho pubblicato un menù di prova.

    Grazie mille in anticipo a tutti.
    Saluti Edoardo

  2. #2
    Non hai postato il css e non hai postato il link...
    "Le uniche cose che sbagli sono quelle che non provi a fare."
    Atipica

  3. #3
    Scusate, mi sono dimenticato il css :


    body{
    padding: 25px;
    }


    .nav-container-outer{
    background: #990000;
    padding: 0px;
    height: 74px;
    background: url(images/nav-bg.jpg);
    }
    .float-left{
    float: left;
    }
    .float-right{
    float: right;
    }
    .nav-container .divider{
    display:block;
    font-size:1px;
    border-width:0px;
    border-style:solid;
    }
    .nav-container .divider-vert{
    float:left;
    width:0px;
    display: none;
    }
    .nav-container .item-secondary-title{
    display:block;
    cursor:default;
    white-space:nowrap;
    }
    .clear{
    font-size:1px;
    height:0px;
    width:0px;
    clear:left;
    line-height:0px;
    display:block;
    float:none;
    }
    .nav-container{
    position:relative;
    zoom:1;
    margin: 0 auto;
    }
    .nav-container a, .nav-container li{
    float:left;
    display:block;
    white-space:nowrap;
    }
    .nav-container div a, .nav-container ul a, .nav-container ul li{
    float:none;
    }
    .nav-container ul{
    left:-10000px;
    position:absolute;
    }
    .nav-container, .nav-container ul{
    list-style:none;
    padding:0px;
    margin:0px;
    }
    .nav-container li a{
    float:none
    }
    .nav-container li{
    position:relative;
    }
    .nav-container ul{
    z-index:10;
    }
    .nav-container ul ul{
    z-index:20;
    }
    .nav-container ul ul ul{
    z-index:30;
    }
    .nav-container ul ul ul ul{
    z-index:40;
    }
    .nav-container ul ul ul ul ul{
    z-index:50;
    }
    li:hover>ul{
    left:auto;
    }
    #nav-container ul {
    top:100%;
    }
    #nav-container ul li:hover>ul{
    top:0px;
    left:100%;
    }


    #nav-container a{
    padding:7px 17px 7px 18px;
    margin: 10px 0px 0px 0px;
    color: #FFFFFF;
    font-family: Trebuchet MS, Arial, sans-serif, Helvetica;
    font-size:14px;
    text-decoration:none;
    font-weight: bold;
    background: url(images/item-primary-bg.gif);
    background-repeat: no-repeat;
    background-position: top;
    }

    #nav-container a:hover{
    color: #6C3600;
    background: url(images/item-primary-bg.gif);
    background-repeat: no-repeat;
    background-position: center;
    }


    #nav-container div, #nav-container ul{
    padding:10px 4px 10px 4px;
    margin:0px 0px 0px 0px;
    background: url(images/item-secondary-container-bg.jpg);
    background-repeat: repeat-x;
    background-color: #FF9900;
    border-bottom: 1px solid #CA6500;
    }


    #nav-container div a, #nav-container ul a{
    padding:3px 10px 3px 6px;
    background-color: #FFFFFF;
    background: url(images/item-secondary-bg.jpg);
    background-repeat: no-repeat;
    background-position: 0px 22px;
    font-size:11px;
    border-width:0px;
    border-style:none;
    margin: 0px 0px 0px 0px;
    width: 149px;
    }


    #nav-container div a:hover, #nav-container ul a:hover{
    background-color: #FFFFFF;
    background: url(images/item-secondary-bg.jpg);
    background-repeat: no-repeat;
    color:#CC0000;
    }


    #nav-container .item-secondary-title{
    cursor:default;
    padding:4px 0px 3px 7px;
    color: #6C3600;
    font-family: Arial, Trebuchet MS, Arial, sans-serif, Helvetica;
    font-size:11px;
    background: url(images/item-secondary-title-bg.jpg);
    background-repeat: no-repeat;
    font-weight:bold;
    }


    #nav-container .divider-horiz{
    border-top-width:1px;
    margin:5px 5px;
    border-color: #C16100;
    }


    #nav-container .divider-vert{
    border-left-width:1px;
    height:15px;
    margin:4px 2px 0px 2px;
    border-color:#AAAAAA;
    }

  4. #4
    scusate ancora, questo è il dove c'è l'esempio del menù : www.fehostess.it

  5. #5
    Aggiungi al css di .nav-container-outer :

    min-width:855px;

    Questo ti garantirà che se la finestra si restringe troppo, compariranno le barre di scorrimento invece che ridursi ancora il menu.

    Ciao!
    "Le uniche cose che sbagli sono quelle che non provi a fare."
    Atipica

  6. #6
    Funziona..
    Gentilissimo sia per la celerità con cui hai risposto sia per l'indicazione precisa che mi hai dato.

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.