Sticky columns in a table

Operating system


Joplin version


What issue do you have?

I want to stick the first column of a table, i.e. the first column is always fixed and visible, even when scrolling to the farthest columns.

It works in a browser but it did not work as intended in Joplin.

      <th style="position: sticky; left: 0; background-color: #f0f0f0; text-align: center;">Fixed Column</th>
      <th style="text-align: center;">Column 2</th>
      <th style="text-align: center;">Column 3</th>
      <th style="text-align: center;">Column 4</th>
      <th style="text-align: center;">Column 5</th>
      <th style="text-align: center;">Column 6</th>
      <th style="text-align: center;">Column 7</th>
      <th style="text-align: center;">Column 8</th>
      <th style="text-align: center;">Column 9</th>
      <th style="text-align: center;">Column 10</th>
      <td style="position: sticky; left: 0; background-color: #f0f0f0; text-align: center;">1</td>
      <td style="text-align: center;">2</td>
      <td style="text-align: center;">3</td>
      <td style="text-align: center;">4</td>
      <td style="text-align: center;">5</td>
      <td style="text-align: center;">6</td>
      <td style="text-align: center;">7</td>
      <td style="text-align: center;">8</td>
      <td style="text-align: center;">9</td>
      <td style="text-align: center;">10</td>
      <td style="position: sticky; left: 0; background-color: #f0f0f0; text-align: center;">11</td>
      <td style="text-align: center;">12</td>
      <td style="text-align: center;">13</td>
      <td style="text-align: center;">14</td>
      <td style="text-align: center;">15</td>
      <td style="text-align: center;">16</td>
      <td style="text-align: center;">17</td>
      <td style="text-align: center;">18</td>
      <td style="text-align: center;">19</td>
      <td style="text-align: center;">20</td>
      <td style="position: sticky; left: 0; background-color: #f0f0f0; text-align: center;">21</td>
      <td style="text-align: center;">22</td>
      <td style="text-align: center;">23</td>
      <td style="text-align: center;">24</td>
      <td style="text-align: center;">25</td>
      <td style="text-align: center;">26</td>
      <td style="text-align: center;">27</td>
      <td style="text-align: center;">28</td>
      <td style="text-align: center;">29</td>
      <td style="text-align: center;">30</td>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.