#112859
Markov
Keymaster

Hi,

Smart Grid (smart-grid) is responsive out of the box, but to make it adapt nicely across different screen sizes you usually combine a few things:

Use percentage or auto width/height

Instead of fixed px, let the Grid resize with its container:


<smart-grid id="grid"></smart-grid>

<style>
  smart-grid {
    width: 100%;
    height: 100%;
  }

  /* Example: responsive container */
  .grid-container {
    width: 100%;
    height: calc(100vh - 100px);
    overflow: hidden;
  }
</style>

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/