How to center button's content
I think I should really review some CSS topics. Could someone give me a light why are the contents inside the buttons not centering? They look awfully unaligned to the center.
I tried anything I could remember ;-;
Codepen: https://codepen.io/leoncelestino/pen/NWZwYgq
(View in mobile mode for easier debug, 'cause I'm not yet done with the mobile, much less the desktop version)
10 Replies
You've set
letter-spacing:.2rem for some reason; when I remove that, they centerWithout the letterspacing it gets ugly ._.)
if it's just for the AC and the brackets, add a non-breaking space between them in the markup
that works
thx
On js does it counts as white space?
yes, you would need to update the conditional in your js to check for
A C if you were using it there, ditto for the bracketswould it be fine to use regex to remove it or am I adding unnecessary complexity
I don't see why you'd need to, but I also don't think it looks bad without the space, so... you could if you wanted, but it seems like an unnecessary step
I would remove it so it don't bothers me when I deal with the calculator's logic
the other alternative is to replace all the inputs with
type="button" with actual buttons, then you can separate presentation from the value/actionic
I did that
it got a lot more better