A Label, TextField and a PasswordField walk into a FlexContainer - No Margin

Using a Perspective View and FlexContainers. All the other Perspective components seem to support adding a style value "margin" save for the PasswordField thus far. It just ignores the setting.

Not sure if I have a typo or some components just don't support margins.

Work with TextField:
image

No work with PasswordField:
image

Did you try including !important?

Did you view it in just the designer or the actual browser? {yes it can make a difference}

Have you inspected it with your browsers developer tools? Is a margin being applied from somewhere else? Where?

It appears that the shorthand doesn't work for the password component, but these do:

  • margin-top
  • margin-right
  • margin-bottom
  • margin-left

I didn't inspect anything though, just tried a couple examples.

The PasswordField seems to work the same with "margin" or "margin-top". It's just that with only "margin-top" set, it is just doing the one margin so the PasswordField moves away from the top 15px but it's now outside the bottom of the FlexContainer and you get a scrollbar. If you do "margin-top" and "margin-bottom" they cancel each other out and it looks like when you use just "margin" or nothing, no change.

It's like there is a setting forcing it to be the same height as the FlexContainer.