n8design / htwoo

hTWOo - a better Fluent UI framework.
http://my.n8d.at/hTWOo
MIT License
91 stars 9 forks source link

No space between hoo-label and hoo-input-text #149

Open gabbsmo opened 3 months ago

gabbsmo commented 3 months ago

Describe the bug I noticed that there was some vertical padding on hoo-label, but when used with the <label> tag at least, that padding will overlap a input element below it.

To Reproduce Steps to reproduce the behavior:

<label class="hoo-label">foobar</label>
<input type="text" class="hoo-input-text" />

Expected behavior I guess the padding around the label was supposed to put some distance between it and surrounding elements.

Desktop (please complete the following information):

Additional context My workaround:

.hoo-label {
  display: block;
}

Not sure if block is the best choice but it works. There are better CSS wizards in this project than me. And as always, just let me know if the current behaviour is by design.

gabbsmo commented 1 month ago

Some more context. In my project I also added width: 100%; to labels, because even if you make inputs full width, iOS Safari will ignore that. This way I ensure that the input is always below the label and do not float up beside it.