Problemi layout con firefox

[Marco_88]

Ciao. Ho un problema di visualizzazione di un sito usando il browser Firefox. Testando lo stesso sito su tutti gli altri browser funziona correttamente.

L'elemento "<ul id">che segue viene buttato fuori dal contenitore principale:

 <ul id="menu">
        <li><a href="<?=$relativePath?>"><?= _('Home') ?></a></li>
        <? //Displays the link when it's enabled, or loggedUser is a seller
            if( $siteOptions['sellLinkEnabled'] || ($loggedUser['seller']) ){ ?>
                <li><a href="<?=$relativePath?>offer/add"><?= _('Sell') ?></a></li>
        <?  } ?>
        <? if($data['siteOptions']['phpBBURL']){ ?>
            <li><a href="<?=$data['siteOptions']['phpBBURL']?>"><?= _('Message boards') ?></a></li>
        <? } ?>
        <?
            //activate webstore link if any offer available in stores
            if($data['webstore']['activeStores'] && $data['webstore']['totalOffers'] && $siteOptions['webstoresEnabled']){
        ?>
        <li><a href="<?=$relativePath?>store"><?= _('Webstores') ?></a></li>
        <?
            }
            
            $menuThematics = $customPages['header'];
            if(count($menuThematics)){
                foreach($menuThematics as $menu){
                    if(trim($menu['name']) !=""){
                ?>
                    <li> <a href="<?=$relativePath?>customPage/<?=$menu['name']?>"> <?=$menu['name']?></a> </li>
                <?
                    }
                }
            }
        ?>
    </ul>

Ho provato a rimetterlo in posizione usando le proprietà position e margin, ma il problema fondamentale è che modificando il tutto per riposizionare l'elemento in base al problema di Firefox mi perde la formattazione corretta per tutti gli altri Browsers.

Esiste una specie di commento condizionale per modificare il l'elemento in base al browser in uso? Per capirci tipo <!--[if lt IE 8] [endif] per Internet Explorer?

Grazie e ciao

 

[filomeni]

per evitare questo genere di problematiche si consiglia un CSS di reset

 

[Marco_88]

Ciao, in effetti ho pensato la stessa la cosa e mi sono dimenticato di dire che già avevo inserito il normalize.css da github di Nicolas Gallagher, purtroppo però senza risultato, anche perché la direttiva che ho inserito riguarda solo Internet Explorer.

<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

Stavo pensando a Modernizer che al suo interno dovrebbe già contenere un reset dei css.

Neanche Modernizr.js funziona e detto tra noi il sito non ha neanche elementi html5, a questo punto pensavo di inserire inserire una direttiva per dire allo user agent di firefox di non mostrare l'elemento <ul id> oppure di modificarlo per reinserirlo quantomeno nel contenitore del sito...

 

[Marco_88]

Allora ho risolto da me e vi spiego come ho fatto:

Il reset dei css non funzionava, navigando su alcuni forum online ho trovato queste direttive specifiche per mozilla firefox
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Mozilla_Extensions.

Inserendo questa direttiva css ho riposizionato il box nella posizione originale

<style type="text/css">
@-moz-document url-prefix() {
    #menu {
     
     width: 960px;
     margin-top: 170px;
     position: absolute;
     
    }
    
    .tablesorter caption, div#content > h2 {
    margin-top:80px;
    
    }
    
                          }
</style>

Ciao!