Hilfe!! HTML Tabelle. Anfängerin braucht Hilfe
Hi Leute,
seit Wochen frage ich mich schon wie ich eine Tabelle fixen kann.
Ich will nicht, dass sich bei einem mouse-hover die Zeile der veränderten Fontgröße anpassen :roll:
Kann mir evtl jemand schnell helfen :oops::(
Mein Code:
HTML-Code:
<!DOCTYPE html>
<head>
<link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'>
<title>Sind das Ihre alten Mitschüler?</title>
<style>
#container { margin:0; max-width:800px; max-height:600px;}
body {font-size: 100%;}
a {text-decoration:none; color:#000000;}
a.sf_button {text-decoration:none; color:#ffffff; display:block;}
table {border:1px solid #000000;}
#tableFixed {table-layout:fixed;}
#tdID_0 {padding:20px 30px 30px 30px; font-family: 'Oswald', sans-serif; font-weight:700; font-size:2.5em; text-align:center;}
#tdID_1 {padding:0px 30px 30px 0px; font-family: 'Oswald', sans-serif; font-weight:700; font-size:1.9em; text-align:center;}
#tdID_2 {padding:20px 30px 0px 30px;}
#tdID_3 {padding:10px 10px 20px 30px;}
img {padding-top:51px;}
#zeile1_1:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_2:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_3:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_4:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_5:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_6:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_7:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_8:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_9:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile1_10:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_1:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_2:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_3:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_4:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_5:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_6:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_7:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_8:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_9:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile2_10:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_1:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_2:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_3:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_4:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_5:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_6:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_7:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_8:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_9:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile3_10:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_1:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_2:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_3:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_4:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_5:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_6:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_7:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_8:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_9:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile4_10:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_1:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_2:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_3:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_4:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_5:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_6:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_7:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_8:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_9:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile5_10:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_1:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_2:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_3:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_4:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_5:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_6:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_7:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_8:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_9:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#zeile6_10:hover {color: #f4c100; font-size:130%; font-weight: bold; text-shadow: 0 0 5px white;}
#button {
font-family: 'Pacifico', cursive;
font-size: 1.458em;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0 8px 0 #e1ad08, 0 15px 20px rgba(0, 0, 0, .35);
-moz-box-shadow: 0 8px 0 #e1ad08, 0 15px 20px rgba(0, 0, 0, .35);
box-shadow: 0 8px 0 #e1ad08, 0 15px 20px rgba(0, 0, 0, .35);
-webkit-transition: -webkit-box-shadow .1s ease-in-out;
-moz-transition: -moz-box-shadow .1s ease-in-out;
-o-transition: -o-box-shadow .1s ease-in-out;
transition: box-shadow .1s ease-in-out;
color: #fff;
}
#button span {
text-shadow: 0 -1px 1px rgb(207, 155, 8);
display: inline-block;
padding: 20px 30px;
background-color: #f4c100;
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(hsla(49, 78%, 79%, 0.80)), to(hsla(47, 100%, 47%, 0.28)));
background-image: -webkit-linear-gradient(hsla(49, 78%, 79%, 0.80), hsla(47, 100%, 47%, 0.20));
background-image: -moz-linear-gradient(hsla(49, 78%, 79%, 0.80), hsla(47, 100%, 47%, 0.20));
background-image: -o-linear-gradient(hsla(49, 78%, 79%, 0.80), hsla(47, 100%, 47%, 0.20));
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, .15);
-moz-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, .15);
box-shadow: inset 0 -1px 1px rgba(255, 255, 255, .15);
font-family: 'Pacifico', Arial, sans-serif;
line-height: 1;
-webkit-transition: background-color .2s ease-in-out, -webkit-transform .1s ease-in-out;
-moz-transition: background-color .2s ease-in-out, -moz-transform .1s ease-in-out;
-o-transition: background-color .2s ease-in-out, -o-transform .1s ease-in-out;
transition: background-color .2s ease-in-out, transform .1s ease-in-out;
}
#button:hover span {
background-color: #f4c100;
text-shadow: 0 -1px 1px rgba(210, 84, 244, 0.90), 0 0 5px rgba(255, 255, 255, .8);
}
#button:active, #button:focus {
-webkit-box-shadow: 0 8px 0 #f4c100, 0 12px 10px rgba(0, 0, 0, .3);
-moz-box-shadow: 0 8px 0 #f4c100, 0 12px 10px rgba(0, 0, 0, .3);
box-shadow: 0 8px 0 #e1ad08, 0 12px 10px rgba(0, 0, 0, .3);
}
#button:active span {
-webkit-transform: translate(0, 4px);
-moz-transform: translate(0, 4px);
-o-transform: translate(0, 4px);
transform: translate(0, 4px);
}
#padding_button {padding: 40px 20px 20px 0;}
</style>
</head>
<BODY>
<div id="container">
<a href="<mpvc/>http://<mpck/>&mpro=http://www.stayfriends.de/sfvc/inboundlinks/ADB1Z?ABBZ=8730&AFBZ=f18c2fb07d33bd15bf3cc09f664272b0d6b22556_" target="_blank" class="">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td id="tdID_0">Wie alt sind Sie?</td>
</tr>
<tr>
<td id="tdID_1" align="center">
<table border="0" cellpadding="0" cellspacing="0" align="center" width="100%">
<tr bgcolor="#e8eef5">
<td id= "zeile1_1" style="color:#0077b3;" valign="middle" align="center" width="10%"><b>30</b></td>
<td id= "zeile1_2" style="" valign="middle" align="center" width="10%">31</td>
<td id= "zeile1_3" style="" valign="middle" align="center" width="10%">32</td>
<td id= "zeile1_4" style="" valign="middle" align="center" width="10%">33</td>
<td id= "zeile1_5" style="" valign="middle" align="center" width="10%">34</td>
<td id= "zeile1_6" style="" valign="middle" align="center" width="10%">35</td>
<td id= "zeile1_7" style="" valign="middle" align="center" width="10%">36</td>
<td id= "zeile1_8" style="" valign="middle" align="center" width="10%">37</td>
<td id= "zeile1_9" style="" valign="middle" align="center" width="10%">38</td>
<td id= "zeile1_10" style="" valign="middle" align="center" width="10%">39</td>
</tr>
<tr>
<td colspan="10"><img src="http://creative.stayfriends.de/DE/500x600_howold-text-classphoto-fries_DE_0242_a/pixt.gif" width="5" height="10" border="0" alt="" title=""></td>
</tr>
<tr bgcolor="#f3f6fa">
<td id= "zeile2_1" style="color:#0077b3;" valign="middle" align="center" width="10%"><b>40</b></td>
<td id= "zeile2_2" style="" valign="middle" align="center" width="10%">41</td>
<td id= "zeile2_3" style="" valign="middle" align="center" width="10%">42</td>
<td id= "zeile2_4" style="" valign="middle" align="center" width="10%">43</td>
<td id= "zeile2_5" style="" valign="middle" align="center" width="10%">44</td>
<td id= "zeile2_6" style="" valign="middle" align="center" width="10%">45</td>
<td id= "zeile2_7" style="" valign="middle" align="center" width="10%">46</td>
<td id= "zeile2_8" style="" valign="middle" align="center" width="10%">47</td>
<td id= "zeile2_9" style="" valign="middle" align="center" width="10%">48</td>
<td id= "zeile2_10" style="" valign="middle" align="center" width="10%">49</td>
</tr>
<tr>
<td colspan="10"><img src="http://creative.stayfriends.de/DE/500x600_howold-text-classphoto-fries_DE_0242_a/pixt.gif" width="33,3%" height="10" border="0" alt="" title=""></td>
</tr>
<tr bgcolor="#e8eef5">
<td id= "zeile3_1" style="color:#0077b3;" valign="middle" align="center" width="10%"><b>50</b></td>
<td id= "zeile3_2" style="" valign="middle" align="center" width="10%">51</td>
<td id= "zeile3_3" style="" valign="middle" align="center" width="10%">52</td>
<td id= "zeile3_4" style="" valign="middle" align="center" width="10%">53</td>
<td id= "zeile3_5" style="" valign="middle" align="center" width="10%">54</td>
<td id= "zeile3_6" style="" valign="middle" align="center" width="10%">55</td>
<td id= "zeile3_7" style="" valign="middle" align="center" width="10%">56</td>
<td id= "zeile3_8" style="" valign="middle" align="center" width="10%">57</td>
<td id= "zeile3_9" style="" valign="middle" align="center" width="10%">58</td>
<td id= "zeile3_10" style="" valign="middle" align="center" width="10%">59</td>
</tr>
<tr>
<td colspan="10"><img src="http://creative.stayfriends.de/DE/500x600_howold-text-classphoto-fries_DE_0242_a/pixt.gif" width="33,3%" height="10" border="0" alt="" title=""></td>
</tr>
<tr bgcolor="#f3f6fa">
<td id= "zeile4_1" style="color:#0077b3;" valign="middle" align="center" width="10%"><b>60</b></td>
<td id= "zeile4_2" style="" valign="middle" align="center" width="10%">61</td>
<td id= "zeile4_3" style="" valign="middle" align="center" width="10%">62</td>
<td id= "zeile4_4" style="" valign="middle" align="center" width="10%">63</td>
<td id= "zeile4_5" style="" valign="middle" align="center" width="10%">64</td>
<td id= "zeile4_6" style="" valign="middle" align="center" width="10%">65</td>
<td id= "zeile4_7" style="" valign="middle" align="center" width="10%">66</td>
<td id= "zeile4_8" style="" valign="middle" align="center" width="10%">67</td>
<td id= "zeile4_9" style="" valign="middle" align="center" width="10%">68</td>
<td id= "zeile4_10" style="" valign="middle" align="center" width="10%">69</td>
</tr>
<tr>
<td colspan="10"><img src="http://creative.stayfriends.de/DE/500x600_howold-text-classphoto-fries_DE_0242_a/pixt.gif" width="33,3%" height="10" border="0" alt="" title=""></td>
</tr>
<tr bgcolor="#e8eef5">
<td id= "zeile5_1" style="color:#0077b3;" valign="middle" align="center" width="10%"><b>70</b></td>
<td id= "zeile5_2" style="" valign="middle" align="center" width="10%">71</td>
<td id= "zeile5_3" style="" valign="middle" align="center" width="10%">72</td>
<td id= "zeile5_4" style="" valign="middle" align="center" width="10%">73</td>
<td id= "zeile5_5" style="" valign="middle" align="center" width="10%">74</td>
<td id= "zeile5_6" style="" valign="middle" align="center" width="10%">75</td>
<td id= "zeile5_7" style="" valign="middle" align="center" width="10%">76</td>
<td id= "zeile5_8" style="" valign="middle" align="center" width="10%">77</td>
<td id= "zeile5_9" style="" valign="middle" align="center" width="10%">78</td>
<td id= "zeile5_10" style="" valign="middle" align="center" width="10%">79</td>
</tr>
<tr>
<td colspan="10"><img src="http://creative.stayfriends.de/DE/500x600_howold-text-classphoto-fries_DE_0242_a/pixt.gif" width="5" height="10" border="0" alt="" title=""></td>
</tr>
<tr bgcolor="#f3f6fa">
<td id= "zeile6_1" style="color:#0077b3;" valign="middle" align="center" width="10%"><b>80</b></td>
<td id= "zeile6_2" style="" valign="middle" align="center" width="10%">81</td>
<td id= "zeile6_3" style="" valign="middle" align="center" width="10%">82</td>
<td id= "zeile6_4" style="" valign="middle" align="center" width="10%">83</td>
<td id= "zeile6_5" style="" valign="middle" align="center" width="10%">84</td>
<td id= "zeile6_6" style="" valign="middle" align="center" width="10%">85</td>
<td id= "zeile6_7" style="" valign="middle" align="center" width="10%">86</td>
<td id= "zeile6_8" style="" valign="middle" align="center" width="10%">87</td>
<td id= "zeile6_9" style="" valign="middle" align="center" width="10%">88</td>
<td id= "zeile6_10" style="" valign="middle" align="center" width="10%">89</td>
</tr>
</table>
</td>
</tr>
<tr>
<td id="tdID_2">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td border-top="5px solid" align="left"><img src="http://creative.stayfriends.de/DE/500x600_howold-text-classphoto-fries_DE_0242_a/classphoto01.jpg" width="100%" border="0" alt="" title=""></td>
<td align="center"><img src="http://creative.stayfriends.de/DE/500x600_howold-text-classphoto-fries_DE_0242_a/classphoto03.jpg" width="100%" border="0" alt="" title=""></td>
<td align="right"><img src="http://creative.stayfriends.de/DE/500x600_howold-text-classphoto-fries_DE_0242_a/classphoto02.jpg" width="100%" border="0" alt="" title=""></td>
</tr>
</table>
</td>
</tr>
<tr>
<td id="tdID_3" class= "td_tags">
<table id="padding_button" border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="24%" align="left" ><img src="" width="137" height="23" border="0" ></td>
<td width="43%" align="right">
<a href="<mpvc/>http://<mpck/>&mpro=http://www.stayfriends.de/sfvc/inboundlinks/ADB1Z?ABBZ=8730&AFBZ=f18c2fb07d33bd15bf3cc09f664272b0d6b22556_" id="button"><span>Schulfreunde wiederfinden!</span></a></td>
</tr>
</table>
</td>
</tr>
</table>
</a>
</div>
</body>
</html>
|