Probleme de float celon les naviguateurs

Ce sujet est résolu
Default
,

Bonsoir, j'ai remarquer que sur opera et ie 8 j'avais des problemes avec une des elements en float right et left.

Alors comme je ne trouvais pas la source du probleme ni la solution je vous demande :)

Le probleme ce trouve dans la sidebar a droite sur les catégories.

Merci d'avance, car c'est un probleme genant.

10 Réponse

4307
,

Bha enlève le float: left; ? :p ( au #categorie_sidebar li a ) ^^

210
,

Comme dit PhiSyx il y a un float dans l'air qui gène. Moi je ferai un truc du genre :

#categorie_sidebar .left, #categorie_sidebar .right
{
    display:block;
    float:left;
    list-style:none;
    font-family: /* Si il y a besoin */;
    margin: /* Si il y a besoin */;
}
#categorie_sidebar .left
{
    text-align:left;
    margin: /* A voir en fonction de ton site */
}
#categorie_sidebar .right
{
    text-align:right;
    margin: /* A voir en fonction de ton site */
}
##categorie_sidebar .separator
{
    float:left;
    background-image: .... ;
    background-repeat:no-repeat;
    height: .... ;
    margin: .... ;
}

Puis compléter avec le style des liens et des "hovers".

1
,

Tu pourrais envoyer une capture de ce que ça doit rendre et de ce que ça rend sur IE8 et Opera ?

210
,

Pour IE tu peux utiliser les " hacks" CSS de Internet Explorer pour ce qui est de Opera, je rencontre pas mal de soucis aussi sur certains site est particulièrement avec les forum du genre "forumactif" ou autre...

Default
,

Alors voila l'image quand tous fonctionne (firefow, chrome, safari) :

Et quand sa ne marche pas :

Demandez moi si vous avez vraiment besoin du code, moi je suis perdu :(

210
,

Ouai fait voir ton code HTML & CSS ^^

Default
,

Voilà, je vous donne le code que j'ai mis dans Wordpress et le css :

<div id="categorie_sidebar">
        <ul class="left">    
        <?php    
            $id = get_category_by_slug('blog');    
            $id = $id->term_id;    
            $args = array(    
                'type' => 'post',    
                'child_of' => $id,    
                'hide_empty' => 0    
            );   
            $categories = get_categories($args);    
            $i=0;    
            $all = $categories;  
            $all = count($all);  
            $TotalCategories = $all;    


            if($TotalCategories%2 == 1){  
                $TotalCategories += 1;  
            }
            $TotalCategories = ($TotalCategories/2);  


            foreach($categories as $category){    
                $i++;    
                echo '<li><a href="'.get_category_link($category->term_id).'">';    
                echo $category->name;    
                echo '</a></li>';    
                echo ($i%$TotalCategories==0) ? '</ul><div style="height: 165px; display: block; float: left" class="sepa_v"></div><ul class="right">' : '';    
            }  
        ?>    
        </ul>  
    </div>
    <div class="clear"></div>

Et pour le code CSS

#categorie_sidebar
{
    margin: 20px 0 0 0;
}
#categorie_sidebar li
{
    list-style: none;
}
#categorie_sidebar li a
{
    display: block;
    width: 119px; /* -10px */
    height: 26px;
    line-height: 26px;
    padding: 0 0 0 10px;
    float: left;
}
#categorie_sidebar ul.right li a
{
    display: block;
    width: 119px; /* -10px */
    height: 26px;
    line-height: 26px;
    padding: 0 10px 0 0;
    text-align: right;
    float: right;
}
#categorie_sidebar li a:hover
{
    background: url(images/sidebar/categorie_li_hover.png);
    text-decoration: none;
}
1403
,

il y a aussi le fait de ne pas faire un clear:both; apres la fermeture de ton dernier

Default
,

En effet, il suffisait juste d'enlever le "float: left" !

Merci à tous :)

1403
,

de rien , clique sur l'icone pour dire que ton sujet est résolu !