Unsupported property warning in chrome developer tools

Dash Python
1

Something that is not a problem in practice but I’m curious.

I display my logo using:
html.Img(src=LOGO_PATH, style=LOGO_STYLE)
Where:
LOGO_STYLE = {
“max-height”: “100px”,
“max-width”: “100%”,
“display”: “block”,
“margin-left”: “auto”,
“margin-right”: “auto”,
}

In the Chrome developer tools I get this warning:
Warning: Unsupported style property max-height
And the same one for margin-left, margin-right, and max-width.

At first I thought I use wrong styles and these properties just fail to work, but when I comment them our or change values I see that my layout is changed accordingly.

So why do I get the error?

2

Hey @mingw64,

As you indicated, the feedback you get is a warning not an error. Hence, it does not a problem in practice indeed.

My best guess is that, the used format is a non-canonical way for the interpreter language. Think of it like using ‘int’ as a variable name in Python. It works, but may lead to a confusion… Hence, Chrome developer tools warns you about the possible confusion…

3

Hello @mingw64,

You are encountering this because React does not user margin-left, but instead marginLeft, so you need to adjust your properties accordingly. :slight_smile:

It still manages to parse the styles properly, but this is why you are having an error.