Skip to content

Fix margin top for input field in combination with icon, label and input-control#47

Merged
Spiderpig86 merged 2 commits intoSpiderpig86:masterfrom
FlorianWoelki:master
Nov 10, 2020
Merged

Fix margin top for input field in combination with icon, label and input-control#47
Spiderpig86 merged 2 commits intoSpiderpig86:masterfrom
FlorianWoelki:master

Conversation

@FlorianWoelki
Copy link
Copy Markdown
Contributor

  • Fixed a minor issue: whenever using a icon and label with input-control there was a not good looking margin-top

Description

There is an issue when putting an icon and label in combination with an input field. Because of the input-control class there will be a not good looking margin between the label and the input field. I've fixed this by adding a margin-top 0 whenever there is a label above the input-control class.

Fixes # (issue)

Type of change

Please delete options that are not relevant.

  • Bug fix (non-breaking change which fixes an issue)

How Has This Been Tested?

This has been tested by creating a input field with a icon and a label:

<label>Test Label</label>
<div class="input-control">
  <input type="text" class="input-contains-icon" placeholder="Test">
  <span class="icon">A</span>
</div>

Current behaviour:
image

Expected behaviour:
image

- Fixed a minor issue: whenever using a icon and label with input-control there was a not good looking margin-top
@FlorianWoelki FlorianWoelki changed the title chore(forms.scss): Fix for input-control with use of icon and label Fix margin top for input field in combination with icon, label and input-control Nov 9, 2020
@Spiderpig86 Spiderpig86 merged commit 62cb635 into Spiderpig86:master Nov 10, 2020
@Spiderpig86
Copy link
Copy Markdown
Owner

🙌 Thanks for the fix!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants