4 ms·
Let's not. This is a huge amount of unnecessary code just to add some whitespace. Instead you could just directly add a whitespace character between the icon
by perilunar 6y ago
Let's not.
This is a huge amount of unnecessary code just to add some whitespace.
Instead you could just directly add a whitespace character between the icon and the text, e.g. a non-breaking space ( ), and en-space ( ), or an em-space ( ). Or just add a right margin to the icon — there's no need for an extra wrapper element.
- rado 6y agoYes, my first thought was
- cookiengineer 6y agoLet's not use space characters in the markup. Instead, use "white-space: nowrap" [1] in CSS. Well, or just read up on the display box model in the first place. [1] https://developer.mozilla.org/en-US/docs/Web/CSS/white-space https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
- perilunar 6y ago"white-space: nowrap" just stops line wrapping — it won't add a space that doesn't already exist in the source code. The cleanest way to add whitespace in this situation is to add a right margin to the icon. The quickest way is to add an HTML character entity. The lightest way is to add a single unicode space character before the text.
- alxlaz 6y agoY'all realize that this is precisely why some people just want to bring spacer GIFs back, right :-D?
- 1_player 6y ago> Let's not use space characters in the markup. Why not?
- FriedrichN 6y ago> This is a huge amount of unnecessary code just to add some whitespace. Only if you use the whole React nonsense. You could just make a CSS class and use that on <span> elements to use as spacer elements. That's hardly 'a huge amount' of code.