Initially hidden date input has wrong width #568

maiermic · 2016-05-17T10:37:12Z

I asked a related question on StackOverflow, but I suspect this behavior might be a bug.

I use Webshim polyfill to guide a user step by step through parts of a form. A date input is hidden at page load style="display: none;". It's width is specified in percentage. Webshim sets the width of the input wrapper element (that is shown instead of the actual date input) at page load to a fixed width. It does not update the width of the wrapper element when it is shown $('#initiallyHidden').show();. But it updates the width if the user resizes the window.

I expected Webshim to update the width of the element wrapper automatically on show, but it does not. Is this intended?

webshim.activeLang('de');
webshims.setOptions('forms-ext', {
  replaceUI: true
});
webshims.polyfill();
webshims.cfg.no$Switch = true;

$('#showHiddenInput').click(function () {
  $('#initiallyHidden').show();
});

.full-width {
  width: 100%;
}

<!DOCTYPE html>
<html>
<head>
  <script src="https://code.jquery.com/jquery-2.1.4.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/webshim/1.15.10/dev/polyfiller.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <form action="">
    <button id="showHiddenInput">show hidden input</button>
    <div id="initiallyHidden" style="display: none;">
      <input name="initiallyHidden" type="date" class="full-width" required>
      <label for="initiallyHidden">Input was initially hidden and should have full width (100%)</label>
    </div>
  </form>
</body>
</html>

The text was updated successfully, but these errors were encountered:

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Initially hidden date input has wrong width #568

Initially hidden date input has wrong width #568

maiermic commented May 17, 2016

Initially hidden date input has wrong width #568

Initially hidden date input has wrong width #568

Comments

maiermic commented May 17, 2016