Mi sitio web se aloja en Weebly, en el tengo tablas informativas, que son grandes para las pantallas de celulares, por lo que necesito que se muestren con su primera fila y columna fijada para ofrecer mejor lectura. Las tablas las agregue con html en una función cuadro </>, que me brinda un cuadro donde ingresar el código para que se muestre ahí la tabla.
El código ejemplo que necesito me agreguen lo necesario para que se fijen la primera fila y columna es el siguiente (el mismo fue un intento de fijar la primer columna pero como pueden ver en
https://www.suprepaga.com/correccion.html se desarma la primer columna mostrandose sin forma lineal):
<!DOCTYPE html>
<html>
<head>
<style>
#customers {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
.Gris {color: #31B404;}
#customers td, #customers th {
border: 1px solid #ddd;
padding: 8px;
}
#customers tr:nth-child(even){background-color: #f2f2f2;}
#customers tr:hover {background-color: #ddd;}
#customers th {
padding-top: 12px;
padding-bottom: 12px;
text-align: Center;
background-color: #FFFFFF;
color: #424242;
}
#customers td {
padding-top: 4px;
padding-bottom: 4px;
text-align: Center;
}
table {
display: block;
overflow-x: auto;
}
.static {
position: absolute;
background-color: white;
}
.first-col {
padding-left: 250px!important;
}
</style>
</head>
<body>
<CENTER>
<table id="customers">
<tr>
<th class="static" scope="col"><small>Referencias:<br>CC = Con Copago<br>SC = Sin Copago<br>CT = Con Tope<br>ST = Sin Tope<br>CL = Con Límites<br>SL = Sin Límites<br>P.M.O. = Programa Médico Obligatorio</small></th>
<th class="first-col" scope="col"><a href="
https://www.suprepaga.com/aca-salud-medicina-privada.html"><img src="
https://i.imgur.com/ADSIXVj.jpg" alt="Apple" align="center" width="150" height="90"/></a></th>
<th scope="col"><a href="
https://www.suprepaga.com/aca-salud-medicina-privada.html"><img src="
https://i.imgur.com/ADSIXVj.jpg" alt="Apple" align="center" width="150" height="90"/></a></th>
<th scope="col"><a href="
https://www.suprepaga.com/aca-salud-medicina-privada.html"><img src="
https://i.imgur.com/Ln2x4Yx.jpg" alt="Apple" align="center" width="150" height="90"/></a></th>
<th scope="col"><a href="
https://www.suprepaga.com/aca-salud-medicina-privada.html"><img src="
https://i.imgur.com/WXVbuaS.jpg" alt="Apple" align="center" width="150" height="90"/></a></th>
<th scope="col"><a href="
https://www.suprepaga.com/aca-salud-medicina-privada.html"><img src="
https://i.imgur.com/WXVbuaS.jpg" alt="Apple" align="center" width="150" height="90"/></a></th>
</tr>
<tr>
<td class="static" scope="row"><a href="
https://www.suprepaga.com/aca-salud-medicina-privada.html"><img src="
https://i.imgur.com/jgGXHQe.png" alt="Medicamentos" align="center" width="90" height="90"/></a><br>MEDICAMENTOS</th>
<td class="first-col">AS204</th>
<td>AS200</th>
<td>AS300</th>
<td>AS400</th>
<td>AS500</th>
</tr>
<tr>
<td class="static" scope="row">- Medicamentos<br>- Material Descartable<br>- Material de Contraste</td>
<td class="first-col">SC - ST</td>
<td>SC - ST</td>
<td>SC - ST</td>
<td>SC - ST</td>
<td>SC - ST</td>
</tr>
<tr>
<td class="static" scope="row">Medicación Oncológica (Ambulatoria e Internación)</td>
<td class="first-col">SC - ST</td>
<td>SC - ST</td>
<td>SC - ST</td>
<td>SC - ST</td>
<td>SC - ST</td>
</tr>
</table>
</CENTER>
</body>
</html>
Plazo de Entrega: No definido