Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript How to Build a Toggle-able Icon Sidebar like WordPress Dashboard Reply To: How to Build a Toggle-able Icon Sidebar like WordPress Dashboard

#263236
verythorough
Participant

I just stumbled on this while looking for something else. I’m sure you figured things out or decided to do something else, but in case anyone else comes here and would like to use your fiddle, the reason the links are varied widths in the beginning is because <span> elements are inline by default, and therefore can’t have widths. If you add display: inline-block to the span rule, they’ll respect your width setting on the initial load.

As for why the widths are fine after the first collapse, it looks like jquery is actually applying the same display property to the span when it does the animation. (Check the inspector while clicking the collapse button, and you’ll see it get added.) I imagine they do this to inline elements to avoid the exact issue you were having.