question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Different left padding of input field and dropdown

See original GitHub issue

Which package is this issue related to?

ffe-form

Describe your issue (screenshots welcome!)

.ffe-input-field has a left padding of 13px while .ffe-dropdown has a left padding of 10px.

What is the expected behavior?

I expect input fields and dropdowns to have the same left paddings for proper form alignment.

What is the actual behavior?

Input fields and dropdowns have different left paddings which gives uneven form alignment.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
henrikhermansencommented, Apr 27, 2018

I’m sorry, @hodoea , I should’ve supplied a screenshot to clearify.

Padding is the distance between the border and the text inside the field.

In this image “Velg fond” is a searchable dropdown (which uses .ffe-dropdown) with 10px between border and text, while “Beløp” is a normal input (with .ffe-input-field) with 13px between border and text. image

0reactions
hodoeacommented, May 4, 2018

Can you change it to 13 px same as ffe-input-field? 😃 @henrikhermansen

Read more comments on GitHub >

github_iconTop Results From Across the Web

Text Padding in Select Boxes - html - Stack Overflow
I used a set of CSS hacks to assign different padding-left values per browser using calc with "base" value for left padding. I.e....
Read more >
padding-left - CSS: Cascading Style Sheets - MDN Web Docs
The padding-left CSS property sets the width of the padding area to the left of an element.
Read more >
How to do padding in the left and right of the dropdown boxes ?
If you are talking about select box itself, you can add padding into left by injecting some css like this: select { text-indent:...
Read more >
CSS Forms - W3Schools
Use the padding property to add space inside the text field. Tip: When you have many inputs after each other, you might also...
Read more >
Input group · Bootstrap v5.0
Input groups wrap by default via flex-wrap: wrap in order to accommodate custom form field validation within an input group. You may disable...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found