Ich habe eine Frage zu Tabellen untereinander und der Option diese ein/auszublenden.
Alles klappt soweit wunderbar, in allen Browsern klappt es einwandfrei, es treten keine optischen Fehler auf. Außer wenn ich das ganze Spiel auf einem Smartphone laufen lasse.
Folgende Situation. Ich habe ein HTML-Dokument mit insgesamt 10 Tabellen untereinander. Da per Option-Menü jeweils eine andere Möglichkeit geboten werden soll, blende ich die Tabellen je nach Option ein/aus.
Das klappt auch. Jedoch kommt irgendwann der Style durcheinander und plötzlich ist z.B. die zweite Zelle nicht mehr an der Stelle wie vorher.
Hat jemand schon mal sowas gehabt und kann ggf. einen Tip geben ?.
Ich habe die Struktur folgend aufgebaut:
usw.... also insgesamt 10 solche Tabellen untereinander. Jedoch kommt es spätestens nach dem Ausblenden der Tabelle1 und Einblenden der Tabelle2 zu einer unschönen Formatierung.
Hat jemand hier einen Tip ?.. Vielen Dank im voraus.
Alles klappt soweit wunderbar, in allen Browsern klappt es einwandfrei, es treten keine optischen Fehler auf. Außer wenn ich das ganze Spiel auf einem Smartphone laufen lasse.
Folgende Situation. Ich habe ein HTML-Dokument mit insgesamt 10 Tabellen untereinander. Da per Option-Menü jeweils eine andere Möglichkeit geboten werden soll, blende ich die Tabellen je nach Option ein/aus.
Das klappt auch. Jedoch kommt irgendwann der Style durcheinander und plötzlich ist z.B. die zweite Zelle nicht mehr an der Stelle wie vorher.
Hat jemand schon mal sowas gehabt und kann ggf. einen Tip geben ?.
Ich habe die Struktur folgend aufgebaut:
Code:
<html>
<head>
<style type="text/css">table { width:100%; } td { vertical-align:center; overflow:hidden; }</style>
</head>
<body>
<form name="xxxxx">
<tbody>
<table id="xxxxxx" align="left" small style="table-layout:fixed;text-align:left;color:#F2F2F2;">
<tr>
<td colspan="2" style="width:40%" align="left" valign="middle" id="xxxx"><b>Text</b></td>
<td id="xxxxx" align="left"><input class="inpt" style="color:#ffffff;background-color:#0000B2;border-color: #0000B2;" type="text" data-mini="true" name="xxxx" size="8" maxlength="8" value="" onChange="xxxxxxx" onClick="this.value='';xxxxx"></td>
</tr>
<tr>
<td colspan="2" align="left" valign="middle" id="xxxx"><b>Text</b></td>
<td id="xxxxx" align="left"><input class="inpt" style="color:#ffffff;background-color:#0000B2;border-color: #0000B2;" type="text" data-mini="true" name="xxxx" size="8" maxlength="8" value="" onChange="xxxxxxx" onClick="this.value='';xxxxx"></td>
</tr>
</table>
</tbody>
</form>
</style>
<form name="xxxxx">
<tbody>
<table id="xxxxxx" align="left" small style="table-layout:fixed;text-align:left;color:#F2F2F2;">
<tr>
<td colspan="2" style="width:40%" align="left" valign="middle" id="xxxx"><b>Text</b></td>
<td id="xxxxx" align="left"><input class="inpt" style="color:#ffffff;background-color:#0000B2;border-color: #0000B2;" type="text" data-mini="true" name="xxxx" size="8" maxlength="8" value="" onChange="xxxxxxx" onClick="this.value='';xxxxx"></td>
</tr>
<tr>
<td colspan="2" align="left" valign="middle" id="xxxx"><b>Text</b></td>
<td id="xxxxx" align="left"><input class="inpt" style="color:#ffffff;background-color:#0000B2;border-color: #0000B2;" type="text" data-mini="true" name="xxxx" size="8" maxlength="8" value="" onChange="xxxxxxx" onClick="this.value='';xxxxx"></td>
</tr>
</table>
</tbody>
</form>
</style>
<form name="xxxxx">
<tbody>
<table id="xxxxxx" align="left" small style="table-layout:fixed;text-align:left;color:#F2F2F2;">
<tr>
<td colspan="2" style="width:40%" align="left" valign="middle" id="xxxx"><b>Text</b></td>
<td id="xxxxx" align="left"><input class="inpt" style="color:#ffffff;background-color:#0000B2;border-color: #0000B2;" type="text" data-mini="true" name="xxxx" size="8" maxlength="8" value="" onChange="xxxxxxx" onClick="this.value='';xxxxx"></td>
</tr>
<tr>
<td colspan="2" align="left" valign="middle" id="xxxx"><b>Text</b></td>
<td id="xxxxx" align="left"><input class="inpt" style="color:#ffffff;background-color:#0000B2;border-color: #0000B2;" type="text" data-mini="true" name="xxxx" size="8" maxlength="8" value="" onChange="xxxxxxx" onClick="this.value='';xxxxx"></td>
</tr>
</table>
</tbody>
</form>
</style>
usw.... also insgesamt 10 solche Tabellen untereinander. Jedoch kommt es spätestens nach dem Ausblenden der Tabelle1 und Einblenden der Tabelle2 zu einer unschönen Formatierung.
Hat jemand hier einen Tip ?.. Vielen Dank im voraus.