(no title)
kolanos | 7 months ago
Did we forget how much of a pain CSS still is?
For example, I recently made a UI with a series of numbered steps. To the left of each step is a number with a circle around it as a highlight.
The CSS I came up with looked like this:
.step-number { align-items: center; background-color: #0074cc; border-radius: 50%; color: white; display: flex; font-size: 14px; font-weight: bold; height: 24px; justify-content: center; line-height: 24px; margin-right: 10px; width: 24px; }
Did it produce a circle? Of course not. It produced a squished egg shape.
What did I have to do? I had to add "min-width: 24px;" to the class. Why? Hell if I know. "width: 24px;" should've done the job.
Bootstrap (and now Tailwind) exist for a reason: CSS still sucks.
b_e_n_t_o_n|7 months ago