fixed-column-start-style-issue

by garethrwilliams

HTML

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta charset="utf-8" />

    <link
      rel="stylesheet"
      media="screen"
      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.min.css"
    />
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.min.js"></script>
    <style></style>
    <script type="module" src="./js/fixed-column-start.js"></script>
  </head>
  <body>
    <div id="dealerstock"></div>
  </body>
</html>

JavaScript

const data = [
  {
    xx: null,
    a: null,
    ax: null,
    b: null,
    e: null,
    f: null,
    g: null,
    k: null,
    l: null,
    m: null,
    n: null,
    o: null,
    q: null,
    t: null,
    lst: null,
    lby: null,
  },
  {
    xx: null,
    a: null,
    ax: null,
    b: null,
    e: null,
    f: null,
    g: null,
    k: null,
    l: null,
    m: null,
    n: null,
    o: null,
    q: null,
    t: null,
    lst: null,
    lby: null,
  },
  {
    xx: null,
    a: null,
    ax: null,
    b: null,
    e: null,
    f: null,
    g: null,
    k: null,
    l: null,
    m: null,
    n: null,
    o: null,
    q: null,
    t: null,
    lst: null,
    lby: null,
  },
  {
    xx: null,
    a: null,
    ax: null,
    b: null,
    e: null,
    f: null,
    g: null,
    k: null,
    l: null,
    m: null,
    n: null,
    o: null,
    q: null,
    t: null,
    lst: null,
    lby: null,
  },
  {
    xx: null,
    a: null,
    ax: null,
    b: null,
    e: null,
    f: null,
    g: null,
    k: null,
    l: null,
    m: null,
    n: null,
    o: null,
    q: null,
    t: null,
    lst: null,
    lby: null,
  },
  {
    xx: 1,
    a: 'bf33e1e3-0dcd-4c20-8cea-423a2550b134',
    ax: '8cea-423a2550b134',
    b: '14/12/2022',
    e: 'Man Truck And Bus UK',
    f: 'E-Transit',
    g: '350 L2H2 68kWh 184ps Leader ',
    k: 'call',
    l: '100',
    m: '',
    n: 'NO',
    o: 'true',
    q: '12/2022',
    t: 'call',
    lst: '11:13 AM',
    lby: 'test',
  },
  {
    xx: 2,
    a: '289a168c-10a4-4a8b-bea8-04aeda17a8be',
    ax: 'bea8-04aeda17a8be',
    b: '13/12/2022',
    e: 'Man Truck And Bus UK',
    f: 'Ami Cargo',
    g: '6kW 5.5kWh Auto',
    k: 'hello',
    l: '100',
    m: '',
    o: 'false',
    q: '12/2022',
    lst: '10:54 AM',
    lby: 'test',
  },
];

const hotdealerstock = new Handsontable(
  document.getElementById('dealerstock'),
  {
    licenseKey: 'non-commercial-and-evaluation',
    data: data,
    fixedColumnsStart: 1,
    colHeaders: [
      '',
    ...