Problème de positionnement d'une div sous Chrome

Bonjour à tous,

Avant d'exposer mon problème, je voulais remercier Grafikart pour sa richesse en tuto et autres astuces. Tout ceci m'a permis de créer mon premier site web donc un grand merci !!!

En ce qui concerne mon problème, le titre du post résume bien l'ensemble. Pour résumé, j'ai créé un site web le mois dernier et je souhaiterais le passer en version mobile. J'ai donc adapté mon CSS avec les Media Query mais je me retrouve confronté à un problème depuis une petite semaine maintenant.
J'ai une div qui regroupe la fonction de recherche et le lien vers les réseaux sociaux qui est invisible sur la version desktop mais qui s'affiche lorsque l'écran est inférieur à 480px. Or, cette div s'affiche au bon endroit sous Firefox et IE mais pas sous Chrome...

Une petite image pour illustrer le problème :

Et la partie du code (qui me semble) incriminée dans ce problème :

Une partie du header où se trouve la div incriminée (div class="mobile")

<div class="menu">
    <a class="toggleMenu" href="#"></a>
        <div class="mobile">
            <div class="ct-search" id="ct-search">
                <form method="get" id="mb-searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
                    <div class="ct-search-input-wrap">
                        <input class="ct-search-input" placeholder="Entrez votre requête..." type="text" value="" name="s" id="mb-s"/>
                    </div>
                    <input class="ct-search-submit" type="submit" id="go" value="">
                    <span class="ct-icon-search"></span>
                </form>
            </div>
            <div class="mb-social">
                <ul>
                    <li><a class="mb-icon-facebook" target="_blank" title="Facebook" href="https://www.facebook.com/actionreiki"></a></li>
                    <li><a class="mb-icon-twitter" target="_blank" title="Twitter" href="https://twitter.com/ActionReiki"></a></li>
                    <li><a class="mb-icon-google" target="_blank" title="Google Plus" rel="publisher" href="https://www.google.com/+ActionreikiFr13"></a></li>
                </ul>
            </div>
        </div>                                  
    <?php wp_nav_menu(array(
        'theme_location' => 'nav',
        'menu_class' => 'nav overthrow'                                     
        ));
    ?>
</div>

Et une partie du CSS :

.mobile{
    display:block;
    float:right;
}
.mobile:before,.mobile:after{
    content:" ";
    display:table;
}
.mobile:after{
    clear:both;
}
.mb-social{
    display:block;
    float:right;
    width:150px;
    height:30px;
    padding:10px;
}
.mb-social li{
    float:left;
}
.mb-social li a{
    color:#f6f6f6;
    display:block;
    position:relative;
    height:30px;
    width:30px;
    line-height:40px;
    margin:0 5px; 
    outline:none;
    position:relative;
    text-align:center;
} 
.mb-icon-facebook{
    background:url(img/mb-facebook.png) no-repeat;
    width:20px;
    height:20px;
}
.mb-icon-twitter{
    background:url(img/mb-twitter.png) no-repeat;
    width:20px;
    height:20px;
}
.mb-icon-google{
    background:url(img/mb-google-plus.png) no-repeat;
    width:20px;
    height:20px;
}
      / ***Recherche-mobile*** /
#ct-search{
    display:block;
    float:right;
    margin-top:5px;
}
.ct-search{
    float:right;
    height:30px;
    margin:1px 5px 0;
    position:relative;
    width:30px;
    z-index:100000;
}
.ct-search-input-wrap{
    position:absolute;
    padding-top:2px;
    right:30px;
    height:30px;
    width:0;
    overflow:hidden;
    -webkit-transition: width 200ms;
    -moz-transition: width 200ms;
    transition: width 200ms;
}
.ct-icon-search, input[type="submit"].ct-search-submit{
    width:30px;
    height:30px;
    display:block;
    position:absolute;
    right:0;
    top:0;
    line-height:45px;
    text-align:center;
    cursor:pointer;
}
.ct-icon-search{
    color:#f6f6f6
    ;z-index:90;
}
.ct-search.ct-search-open .ct-icon-search{
    background:#000;
    color:#f6f6f6;
    pointer-events:none
    ;z-index:1;
}
input[type="submit"].ct-search-submit{
    background:transparent;
    color:transparent;
    box-shadow:none;
    border:none;
    padding:0;
    border-radius:0;
    outline:none;
    z-index:-1;
}
.ct-search.ct-search-open input[type="submit"].ct-search-submit{
    z-index:90;
}
input[type="text"].ct-search-input {
    border: none;
    outline: none;
    opacity: 0;
    background: #fff;
    width: 265px;
    height: 30px;
    margin:2px;
    padding: 0 7px;
}
.ct-search.ct-search-open input[type="text"].ct-search-input{
    opacity:1;
}
::-webkit-input-placeholder{
    color:#c6c6c6;
}
:-moz-placeholder{
    color:#c6c6c6;
}
::-moz-placeholder{
    color:#c6c6c6;
}
:-ms-input-placeholder{
    color:#c6c6c6;
}
.ct-icon-search:before{
    content:"\e600";
    font-size:25px;
}
.ct-icon-search:before,.mb-social li a:before{
    font-family:'icomoon';
    font-size:25px;
    font-style:normal;
    font-variant:normal;
    font-height:normal;
    line-height:1;
    text-transform:none;
    -webkit-font-smoothing:antialiased;}
.ct-search.ct-search-open .ct-search-input-wrap{
    width:200px;
}

Je vous remercie d'avance pour vos réponses.