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 < 30.1 >
edited by Eric Nantel
on 2023/07/07 14:41
< >
Change comment: Rollback to version 28.1

Summary

Details

Page properties
Content
... ... @@ -1,53 +1,80 @@
1 1  {{html}}
2 -<!DOCTYPE html>
3 3  <html>
4 4  <head>
5 5   <style>
6 - .table-container {
7 - display: flex;
5 + table {
6 + width: 100%;
7 + border-collapse: collapse;
8 8   }
9 9  
10 - .table-container table {
11 - flex: 1;
10 + th, td {
11 + padding: 8px;
12 + text-align: left;
13 + border-bottom: 1px solid #ddd;
12 12   }
15 +
16 + /* Media query for mobile devices */
17 + @media only screen and (max-width: 600px) {
18 + /* Stack the table columns vertically */
19 + td {
20 + display: block;
21 + }
22 +
23 + /* Add spacing between stacked columns */
24 + td:not(:first-child) {
25 + margin-top: 10px;
26 + }
27 +
28 + /* Hide table headers (th) */
29 + th {
30 + display: none;
31 + }
32 + }
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>
36 + <table>
37 + <tbody>
38 + <tr>
39 + <td>
40 + <table>
41 + <thead>
42 + <tr>
43 + <th>Column 1</th>
44 + </tr>
45 + </thead>
46 + <tbody>
47 + <tr>
48 + <td>Data 1</td>
49 + </tr>
50 + <tr>
51 + <td>Data 3</td>
52 + </tr>
53 + <!-- Add more rows as needed -->
54 + </tbody>
55 + </table>
56 + </td>
57 + <td>
58 + <table>
59 + <thead>
60 + <tr>
61 + <th>Column 2</th>
62 + </tr>
63 + </thead>
64 + <tbody>
65 + <tr>
66 + <td>Data 2</td>
67 + </tr>
68 + <tr>
69 + <td>Data 4</td>
70 + </tr>
71 + <!-- Add more rows as needed -->
72 + </tbody>
73 + </table>
74 + </td>
75 + </tr>
76 + </tbody>
77 + </table>
51 51  </body>
52 52  </html>
53 53  {{/html}}

Recently Visited

Copyright RobotShop 2018