Changes for page LSS-P - Mechanical

Last modified by Eric Nantel on 2024/07/03 09:43
From version < 31.1 >
edited by Eric Nantel
on 2023/07/07 14:41
To version < 27.1 >
edited by Eric Nantel
on 2023/07/07 14:39
< >
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -3,51 +3,56 @@
3 3  <html>
4 4  <head>
5 5   <style>
6 - .table-container {
7 - display: flex;
6 + table {
7 + width: 100%;
8 + border-collapse: collapse;
8 8   }
9 9  
10 - .table-container table {
11 - flex: 1;
11 + th, td {
12 + padding: 8px;
13 + text-align: left;
14 + border-bottom: 1px solid #ddd;
12 12   }
16 +
17 + /* Media query for mobile devices */
18 + @media only screen and (max-width: 600px) {
19 + /* Stack the table columns vertically */
20 + td {
21 + display: block;
22 + }
23 +
24 + /* Add spacing between stacked columns */
25 + td:not(:first-child) {
26 + margin-top: 10px;
27 + }
28 +
29 + /* Hide table headers (th) */
30 + th {
31 + display: none;
32 + }
33 + }
13 13   </style>
14 14  </head>
15 15  <body>
16 - <div class="table-container">
17 - <table>
18 - <thead>
19 - <tr>
20 - <th>Table 1</th>
21 - </tr>
22 - </thead>
23 - <tbody>
24 - <tr>
25 - <td>Data 1</td>
26 - </tr>
27 - <tr>
28 - <td>Data 2</td>
29 - </tr>
30 - <!-- Add more rows as needed -->
31 - </tbody>
32 - </table>
33 -
34 - <table>
35 - <thead>
36 - <tr>
37 - <th>Table 2</th>
38 - </tr>
39 - </thead>
40 - <tbody>
41 - <tr>
42 - <td>Data A</td>
43 - </tr>
44 - <tr>
45 - <td>Data B</td>
46 - </tr>
47 - <!-- Add more rows as needed -->
48 - </tbody>
49 - </table>
50 - </div>
37 + <table>
38 + <thead>
39 + <tr>
40 + <th>Column 1</th>
41 + <th>Column 2</th>
42 + </tr>
43 + </thead>
44 + <tbody>
45 + <tr>
46 + <td>Data 1</td>
47 + <td>Data 2</td>
48 + </tr>
49 + <tr>
50 + <td>Data 3</td>
51 + <td>Data 4</td>
52 + </tr>
53 + <!-- Add more rows as needed -->
54 + </tbody>
55 + </table>
51 51  </body>
52 52  </html>
53 53  {{/html}}
Copyright RobotShop 2018