Changing line height of an element without affecting it's surroundings


Hey everyone,

I am working on the calculator app project and as I set a line height to vertically center the buttons, the decimal point looks lower than the rest. Is there a way to change the line-height of one element in a set of inline elements without affecting surrounding elements or maybe some other way to achieve the same thing?

Also project feedback, please take a look and give me your valuable feedback.

Project link =>



If I might suggest a simpler solution…

If I understand you correctly, you want the “dot” of the decimal vertically centered. One simple solution would be to not use a decimal point but a middle dot, accessed in html with · or ·


Thanks Kevin, that does get the job done!