web-dev-qa-db-fra.com

Centrer et masquer le débordement de WP liens personnalisés de la barre d'outils

J'ai créé 22 liens personnalisés dans la barre d'outils WP pour mon site, mais lorsque je réduis la largeur du navigateur/de l'écran, ils ne répondent pas du tout en termes de CSS et de pile, au lieu de simplement ne pas afficher les liens qui ne tiennent pas.

C'est-à-dire que je veux appliquer margin: center et overflow: masqués pour tous ensemble afin qu'ils se trouvent au centre de la barre d'outils et que ceux qui ne tiennent pas sur différentes tailles de fenêtre seront masqués.

Il serait pratiquement impossible d’inclure tout le code ici, mais j’espère que ces exemples montrent ce que j’ai fait et ce que j’ai fait.

J'ai essayé la classe et l'ID CSS, mais rien n'affecte les liens.

.quicklinksgroup {
    margin: auto !important;
    width: 1600px;
    overflow: hidden;
}

#classquicklinks {
    margin: auto !important;
    width: 1600px;
    overflow: hidden;
}

Comment je génère les nœuds de groupe et parent dans le plugin personnalisé que j'ai créé. J'en ai 22 en boucle pour créer les menus personnalisés déroulants. En blanc, il y a aussi des nœuds enfants, mais je ne pensais pas que vous auriez besoin de les voir car ils sont pratiquement les mêmes et fonctionnent bien. Comme vous pouvez le constater, j’ai également essayé le CSS, qui, à mon avis, devrait être exact, en ligne.

function add_nodes_and_groups_to_toolbar( $wp_admin_bar ) {

args = array(
        'id'    => 'quicklinksgroup',
'title' => '<div id="quicklinksgroupcontainer" style="margin:auto!important;
width: 1600px;
overflow: hidden;
padding-left: 100px;" ></div>',
'meta'   => array( 'class' => 'classquicklinksgroup' )
    );

    $wp_admin_bar->add_group( $args );



    $args = array(
    'id'    => 'parent_node'.$Number.'',
    'title' => '<div id="linkbutton" style="margin-top:2px text-align:center;"><img src="http://example.com/'.$IMG.'" alt="'.$TEXT.'" style="width:40px;height:25px;"></div>',
            'href'  => '/page/'.$Live.'',
            //'meta'  => array( 'class' => 'OnlineQuickLinks' )
            'parent' => 'quicklinks'
        );
        $wp_admin_bar->add_node( $args );

Je sais que je ne suis pas un expert pour poser des questions ici, mais si nous trouvons une solution, cela sera très utile pour moi et pour les autres, car je ne pourrais vraiment rien voir sur les moteurs de recherche.

pluginsphpmenusadmin-bar
1
Gary Carlyle Cook

Vous devez ajouter overflow: hidden; à votre CSS pour #wpadminbar.

Ajoutez ceci à votre CSS:

#wpadminbar {
    overflow: hidden;
}
0
KingCodeFish