[RISOLTO] Blue Dropline Menu e risoluzione video

[andrejoo]

Salve ho aggiunto al sito fatto con joomla 1.5.23 il menu Blue Dropline.

Originariamente era spostato a destra e modificando il #main-menu { nel css  "ojdlcmenu.css" sono riuscito a spostarlo al centro.

Il problema è che con le risoluzioni differenti dalla 1280x1024 il menu si sposta.

Con le risoluzioni inferiori si sposta verso sinistra mentre con quelle superiori si sposta verso destra.

Il css ( ojdlcmenu.css) è questo:

Codice: [Seleziona]

/**
 * @version        $Id: $
 * @author        Nguyen Dinh Luan
 * @package        Joomla!
 * $subpackage    Blue Dropline Menu
 * @copyright    Copyright (C) 2008 - 2011 Joomseller Solutions. All rights reserved.
 * @license        GNU/GPL http://www.gnu.org/licenses/gpl-3.0.html, see LICENSE.txt
 * This file may not be redistributed in whole or significant part.
 */
 
 #main-menu {
    width:972px;
    margin: -25px;
    padding:0px;
    height:0px;
}

#mainlevel {
    width:auto;
    float:right;
    margin:0px;
    padding:0px;
    height:24px;
    margin-right:30px;
}

#sublevel {
    width:100%;
    float:left;
    margin:0px;
    padding:0px;
    height:23px;
    background:none
}


/*Main menu level 1*/
div#mainlevel ul {
    float:left;
    margin:0px;
    padding:0px;
    list-style:none;
    display:inline;
}

div#mainlevel li {
    margin: 0px;
    padding: 0px;
    float: left;
    height:24px;
    padding:0px;
    text-align:center;
    list-style:none;
    background:url(images/main_left.png) top left no-repeat;
    padding-left:5px;
    margin-right:3px;
}

div#mainlevel li.active {
    background:url(images/main_left_on.png) top left no-repeat;
}

div#mainlevel li a {
    float: left;
    text-decoration: none;
    background:url(images/main_right.png) top right no-repeat;
    line-height:24px;
}

div#mainlevel li a#active_menu {
    background:url(images/main_right_on.png) top right no-repeat;
    color:#fff;
}

a.mainlevel {
    display: block;
    color:#999999;
    font-size:14px;
    line-height:18px;
    margin:0px;
    padding:0px 20px 0px 15px;
}

a#active_menu {
   
}

/*Main menu level 2*/

div#sublevel ul {
    margin:0px;
    padding:0px;
    list-style:none;
    display:block;
    float:left;
    height:23px;
    padding:2px 0px;
    margin-left:20px;
}

div#sublevel li {
    float:left;
    margin: 0px;
    padding:0px;
    text-align:center;
    width:auto;
    padding-left:5px;
    line-height:20px;
    background:none;
}
div#sublevel li.active {
    background:url(images/sub_left_on.png) top left no-repeat;
}

div#sublevel li a{
    text-decoration: none;
    float:left;
    line-height:20px;
    color:#fff;
    padding:0px 12px 0px 7px;
}

div#sublevel li a#active_menu{
    background:url(images/sub_right_on.png) top right no-repeat;
    color:#666666;
}

Per lasciarlo sempre al centro indipendentemente dalla risoluzione, che parametro devo modificare o aggiungere?

Grazie
 

[adottauncane]

Ciao andrejoo,
postare il codice serve a poco. E in ogni caso utilizza il tasto # per inserirlo. Molto meglio un link al sito.

[andrejoo]

ok grazie

www.casalessio.it

[conti1]

ciao
metti questo al posto di quello che hai toccato

Codice: [Seleziona]

#main-menu{   
height: 0;   
left: 198px; 
  margin: -25px auto;   
padding: 0; 
  position: relative;   
width: 980px;
}

poi vai qui  e togli

Codice: [Seleziona]

#mainlevel {   
 float: right;<<<<<<<<<< togli questo tag
    height: 24px;   
    margin: 0 30px 0 0;   
    padding: 0;   
   width: auto;}


[andrejoo]

ok grazie ho fatto come mi hai detto e ora rimane al centro.

Ma in  #mainlevel { dovevo solo togliere float: right;

oppure dovevo aggiungere anche margin: 0 30px 0 0;   

Grazie mille

[conti1]

deve diventare in questo modo
#mainlevel {   

    height: 24px;   
    margin: 0 30px 0 0;   
    padding: 0;   
   width: auto;}

[andrejoo]

Ok fatto.

Grazie mille problema risolto.