What did you do? ================ 1. Go to https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number  2. See the "Experimental" and "Non-standard" icons / badges in the quick links navigation not aligned well. What happened? ============== Icons are not aligned to the links and are in front of the items. What should have happened? ========================== * Better vertical alignment of the icons * Icons displayed after each item Is there anything else we should know? ====================================== Here's the macro generating the quick links for this page: https://developer.mozilla.org/en-US/docs/Template:JSRef

Thanks for the bug report Florian. I've refiled it as a beta issue and included a screenshot. For next time, we have a form for filing beta feedback that automatically puts the bug in the right place: http://mzl.la/mdn-redesign-feedback

Adding the following styles to the <i> element will fix this issue: "top: 9px; position: absolute; left: 0;display: block; margin-left:0;" I'd like to ask that the doc writers add an additional CSS class to either the <SPAN> or the <I> used in this fashion so that I can reliably identify the elements which need this styling -- I can assume all of them require this CSS. Can you make this happen Florian?

Thank you David! The "JSRef" macro just calls the normal "ExperimentalBadge" and "NonStandardBadge" macro to include the <span> + <i>, so I decided to not touch these both, because they are used in the normal content all over the place. I added a wrapping <span class="ql-badge"> here, which can be adjusted if needed: <span class="ql-badge"> <span title="This is an experimental API that should not be used in production code."> <i class="icon-beaker"> </i> </span> </span> Also, I've corrected the list structure a bit to get the toggle functionality we want to have here. (You might need a slightly different CSS for the badges' position now)

Is `ql-badge` something we'll be able to use throughout MDN's left sidebar? Or is that specific to something? SHould we choose a more generic name, like "sidebar-icon` or something? Let me know!

Yes, it would be good if the styling is accurate whenever someone wants icons in different sidebars. We can rename that to "sidebar-icon", if you like that better to indicate all kinds of icons here - not just the "badges". Thanks, this is making me happy!

Yep, that would be best. Could you make this update and then I'll send code in to accomplish the task? Thank you!

Macro updated. Renamed the wrapper <span>'s class to "sidebar-icon".

This has been completed via Template:CustomCSS (at the bottom). If I can make a suggestion, I think adding "opacity: 0.3" to those icons. That would make the icon much more subtle.