@media screen and (min-width: 782px) { // Prevent wrapping of admin bar that has more items than admin bar area on desktop/tablet layout #wpadminbar { .quicklinks { justify-content: space-between; > ul > li { float: none !important; } > ul > li, .ab-item { white-space: nowrap; text-overflow: ellipsis; min-width: 0 !important; } .ab-item { overflow: hidden; .ab-label, .display-name { float: none; display: inline; } } } .quicklinks, .quicklinks > ul { display: -ms-flexbox; display: flex; flex-wrap: nowrap; -ms-flex-wrap: nowrap; min-width: 0 !important; } #wp-admin-bar-top-secondary { flex-direction: row-reverse; -ms-flex-direction: row-reverse; } } } @media screen and (max-width: 782px) { // Prevent wrapping of admin bar that has more items than admin bar area on mobile layout #wpcontent { padding-top: 15px; // Browser scrollbar dimension per https://codepen.io/sambible/post/browser-scrollbar-widths(with the overflow-y:hidden; handling the difference between them) } #wpadminbar { display: flex; flex-wrap: nowrap; padding-bottom: 15px; // Browser scrollbar dimension per https://codepen.io/sambible/post/browser-scrollbar-widths (with the overflow-y:hidden; handling the difference between them) overflow-x: scroll; overflow-y: hidden; > *, .ab-top-menu { display: flex; flex-wrap: nowrap; } .ab-sub-wrapper { display: none !important; } } }