CSS "display: table" property is not working in UXP

InDesign
, , , ,
1

Hi all, I am trying to convert my HTML5 extension to UXP plugin. In HTML5 extension CSS property .tableDiv {display: table;} was working fine but in UXP it is not working.
Can anyone help.
Thanks

HTML

<div class="tableDiv">
          <div class="tableCell">
            <ul class="loginForm">
              <li>
                <div class="metaLabel">
                  <label>Username</label>
                </div>
                <div class="metaValue">
                  <input type="text" class="textBoxCss" id="username" value="" />
                </div>
              </li>
              <div class="cr"></div>
              <li>
                <div class="metaLabel">
                  <label>Password</label>
                </div>
                <div class="metaValue">
                  <input type="password" class="textBoxCss" id="password" onkeydown="Util.enterHandler(event)" />
                </div>
              </li>
              <div class="cr"></div>
              <li>
                <div class="metaLabel">
                  <label>&nbsp;</label>
                </div>
                <div class="metaValue" style="width:180px;">
                  <div class="fltLeft">
                    <input type="checkbox" class="marginR0px" value="Remember Me" id="chkRememberMe"
                      onclick="App.toggleRememberMe()" />
                    <label class="smallText" for="chkRememberMe">Remember Me</label>
                  </div>
                  <div class="fltRight btn marginT5px marginR10px">Sign In</div>
                </div>
              </li>
              <div class="cr"></div>
            </ul>
          </div>
        </div>

CSS

.tableDiv {
  display: table;
  width: 100%;
  height: 100%
}
.tableCell {
  display: table-cell;
  margin: auto;
  vertical-align: middle;
}
2

Did you try: Validator for UXP - Visual Studio Marketplace

does it show any hints?