Auch tabellenrpobleme

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Auch tabellenrpobleme

    Hi!
    ich habe mich hier mal schlau gelesen aber leider hilft mir das alles nichts bei meinen problemen!

    Hier ist mal eine musterseite: http://www.b2kclan.org/test.html


    Hier ist mein Code:

    HTML-Quellcode

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    5. <title>Untitled Document</title>
    6. <style type="text/css">
    7. body {
    8. background-color: #ffffff;
    9. }
    10. .b2kclan {
    11. margin: 0px;
    12. padding: 0px;
    13. float: left;
    14. height: auto;
    15. width: auto;
    16. vertical-align: top;
    17. margin-bottom: 0px;
    18. margin-left: 0px;
    19. margin-right: 0px;
    20. margin-top: 0px;
    21. }
    22. </style>
    23. </head>
    25. <table width="100%" border="0" cellspacing="0" cellpadding="0" >
    26. <tr>
    27. <th scope="col" align="left" valign="top">
    28. <table width="1024" border="0" cellpadding="0" cellspacing="0" >
    29. <tr>
    30. <td valign="top" align="left"><img src="Bilder/head.jpg" width="1024" height="131"></td>
    31. </tr>
    32. </table>
    33. <table width="1024" border="0" cellspacing="0" cellpadding="0" align="left">
    34. <tr>
    35. <th scope="col" width="219" valign="top" align="left">
    36. <table width="219" border="0" cellspacing="0" cellpadding="0" align="left">
    37. <tr>
    38. <th scope="col" valign="top" align="left"><img src="Bilder/main.jpg" width="219" height="38" /></th>
    39. </tr>
    40. <tr>
    41. <th scope="col" valign="top" align="left"><img src="Bilder/spacer17.jpg" width="219" height="43" /></th>
    42. </tr>
    43. <tr>
    44. <th scope="col" valign="top" align="left"><img src="Bilder/board.jpg" width="219" height="38" /></th>
    45. </tr>
    46. <tr>
    47. <th scope="col" valign="top" align="left"><img src="Bilder/server.jpg" width="219" height="36" /></th>
    48. </tr>
    49. <tr>
    50. <th scope="col" valign="top" align="left"><img src="Bilder/guestbook.jpg" width="219" height="51" /></th>
    51. </tr>
    52. <tr>
    53. <th scope="col" valign="top" align="left"><img src="Bilder/downloads.jpg" width="219" height="44" /></th>
    54. </tr>
    55. <tr>
    56. <th scope="col" valign="top" align="left"><img src="Bilder/spacer1.jpg" width="219" height="29" /></th>
    57. </tr>
    58. <tr>
    59. <th scope="col" valign="top" align="left"><img src="Bilder/clan-menu.jpg" width="219" height="31" /></th>
    60. </tr>
    61. <tr>
    62. <th scope="col" valign="top" align="left"><img src="Bilder/members.jpg" width="219" height="32" /></th>
    63. </tr>
    64. <tr>
    65. <th scope="col" valign="top" align="left"><img src="Bilder/history.jpg" width="219" height="48" /></th>
    66. </tr>
    67. <tr>
    68. <th scope="col" valign="top" align="left"><img src="Bilder/rules.jpg" width="219" height="43" /></th>
    69. </tr>
    70. <tr>
    71. <th scope="col" valign="top" align="left"><img src="Bilder/spacer2.jpg" width="219" height="24" /></th>
    72. </tr>
    73. <tr>
    74. <th scope="col" valign="top" align="left"><img src="Bilder/contact-menu.jpg" width="219" height="27" /></th>
    75. </tr>
    76. <tr>
    77. <th scope="col" valign="top" align="left"><img src="Bilder/contact-us.jpg" width="219" height="43" /></th>
    78. </tr>
    79. <tr>
    80. <th scope="col" valign="top" align="left"><img src="Bilder/joinus.jpg" width="219" height="47" /></th>
    81. </tr>
    82. <tr>
    83. <th scope="col" valign="top" align="left"><img src="Bilder/fightus.jpg" width="219" height="37" /></th>
    84. </tr>
    85. <tr>
    86. <th scope="col" valign="top" align="left"><img src="Bilder/spacer4.jpg" width="219" height="26" /></th>
    87. </tr>
    88. </table></th>
    89. <th scope="col" width="625" align="left" valign="top">
    90. <table width="625" border="0" cellspacing="0" cellpadding="0" align="left">
    91. <tr>
    92. <th scope="col" align="left" valign="top"><img src="Bilder/latestwars.jpg" /></th></tr>
    93. <tr>
    94. <th scope="col" align="left" width="102" height="128"><img src="Bilder/spacer10.jpg" /></th>
    95. <th scope="col" align="left" width="405" height="128"><img src="Bilder/bg-wars.jpg" /></th>
    96. <th scope="col" align="left" width="118" height="128"><img src="Bilder/spacer11.jpg" /></th>
    97. </tr>
    98. <tr>
    99. <th scope="col" valign="top" align="left"><img src="Bilder/spacer12.jpg"/></th>
    100. </tr>
    101. <tr>
    102. <th scope="col" align="left" valign="top"><img src="Bilder/spacer5.jpg" /></th>
    103. <th scope="col" align="left" valign="top"><img src="Bilder/bg-content.jpg" /></th>
    104. <th scope="col" align="left" valign="top"><img src="Bilder/spacer20.jpg" /></th>
    105. </tr>
    106. <tr>
    107. <th scope="col" align="left" valign="top"><img src="Bilder/spacer9.jpg" /></th>
    108. </tr>
    109. </table>
    112. </th>
    113. <th scope="col" width="175">
    114. <table width="175" align="left">
    115. <tr>
    116. <th align="left" valign="top"><img src="Bilder/sponsoren.jpg" /></th>
    117. </tr>
    118. <tr>
    119. <th align="left" valign="top"><img src="Bilder/bg-sponsoren.jpg" />
    120. <img src="Bilder/spacer.gif" /></th>
    121. </tr>
    122. <tr>
    123. <th align="left" valign="top"><img src="Bilder/shoutbox.jpg" /></th>
    124. </tr>
    125. <tr>
    126. <th align="left" valign="top"><img src="Bilder/bg-shout.jpg" /></th>
    127. </tr>
    128. <tr>
    129. <th align="left" valign="top"><img src="Bilder/spacer11-31.jpg" /></th>
    130. </tr>
    131. </table>
    132. <th scope="col" width="5" align="left" valign="top"><img src="Bilder/spacer13.jpg" /></th>
    133. </tr>
    134. </table>
    136. </th>
    137. </tr>
    138. </table></th>
    139. </tr>
    140. </table></th>
    141. </tr>
    142. </table>
    143. </body>
    144. </html>
    Alles anzeigen


    Vom Prinzip hier müsste es ja gehen aber ich versteh es weiter nicht was das problem ist!

    Danke mal im Voraus

    MFG
    Chris4u

  • du hast wahrscheinlich irgendeinen <table>, <tr>, <td> oder <th> tag nicht richtig geschlossen. und in der formatierung hier ist es sehr mühsam zu erkennen, welcher das sein kann.
    Tipp: Für jede neue Verschachtelungen ein Leerzeichen mehr einrücken.

    Dann wird man am Ende merken, dass immer noch Leerzeichen da sind und kann das durchgehen und findet den Fehler.

    davon abgesehen sind zteilweise in verschiedene zeilen eine unterschiedliche anzahl von spalten, z.b.:

    Quellcode

    1. <table width="625" border="0" cellspacing="0" cellpadding="0" align="left">
    2. <tr>
    3. <th scope="col" align="left" valign="top"><img src="Bilder/latestwars.jpg" /></th></tr>
    4. <tr>
    5. <th scope="col" align="left" width="102" height="128"><img src="Bilder/spacer10.jpg" /></th>
    6. <th scope="col" align="left" width="405" height="128"><img src="Bilder/bg-wars.jpg" /></th>
    7. <th scope="col" align="left" width="118" height="128"><img src="Bilder/spacer11.jpg" /></th>
    8. </tr>

    in der ersten zeile ist nur 1 spalte, in der zweiten gibt es drei. sowas geht nicht. es sei denn man arbeitet mit colspan.

    außerdem frag ich mich auch, warum du immer das <th>-element verwendest. das ist eigentlich für tabellenüberschriften gedacht. verwende doch <td>. dann musst du auch nicht immer extra anbgeben, dass der inhalt nach links ausgerichtet sein soll.

  • Danke für eure antworten! Habe den code neu geschrieben mit colspan!

    Aber es haut noch immer noch nicht so ganz hin wie ich das gerne hätte!

    Hier ist die Testseite:
    http://www.b2kclan.org/test6.html

    Und hier ist mein Code (hoffentlich besser zulesen als der alte)

    HTML-Quellcode

    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    2. <html>
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    5. <title>Untitled Document</title>
    6. </head>
    8. <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    9. <!-- Start Main Table-->
    10. <table width="1024" height= "100%" border="0" cellspacing="0" cellpadding="0" align="left">
    11. <!-- Start Head -->
    12. <tr valign="top">
    13. <th colspan="3" width="1024" height="131"><img src="Bilder/head.jpg" width="1024" height="131" alt="Head"></th>
    14. </tr>
    15. <!--End Head-->
    16. <tr>
    17. <!-- Start Navi Links-->
    18. <td>
    19. <table width="219" border="0" cellspacing="0" cellpadding="0" align="left">
    20. <tr>
    21. <td><img src="Bilder/main.jpg" alt="main"></td>
    22. </tr>
    23. <tr>
    24. <td><img src="Bilder/spacer17.jpg" alt="news"></td>
    25. </tr>
    26. <tr>
    27. <td><img src="Bilder/board.jpg" alt="board"></td>
    28. </tr>
    29. <tr>
    30. <td><img src="Bilder/server.jpg" alt="server"></td>
    31. </tr>
    32. <tr>
    33. <td><img src="Bilder/guestbook.jpg" alt="guestbook"></td>
    34. </tr>
    35. <tr>
    36. <td><img src="Bilder/downloads.jpg" alt="downloads"></td>
    37. </tr>
    38. <tr>
    39. <td><img src="Bilder/spacer1.jpg" alt="spacer1"></td>
    40. </tr>
    41. <tr>
    42. <td><img src="Bilder/clan-menu.jpg" alt="clan-menu"></td>
    43. </tr>
    44. <tr>
    45. <td><img src="Bilder/members.jpg" alt="members"></td>
    46. </tr>
    47. <tr>
    48. <td><img src="Bilder/history.jpg" alt="history"></td>
    49. </tr>
    50. <tr>
    51. <td><img src="Bilder/rules.jpg" alt="rules"></td>
    52. </tr>
    53. <tr>
    54. <td><img src="Bilder/spacer2.jpg" alt="spacer2"></td>
    55. </tr>
    56. <tr>
    57. <td><img src="Bilder/contact-menu.jpg" alt="contact-menu"></td>
    58. </tr>
    59. <tr>
    60. <td><img src="Bilder/contact-us.jpg" alt="contact-us"></td>
    61. </tr>
    62. <tr>
    63. <td><img src="Bilder/joinus.jpg" alt="joinus"></td>
    64. </tr>
    65. <tr>
    66. <td><img src="Bilder/fightus.jpg" alt="fightus"></td>
    67. </tr>
    68. <tr>
    69. <td><img src="Bilder/spacer4.jpg" alt="spacer4"></td>
    70. </tr>
    71. </table>
    72. </td>
    73. <!-- End Navi Links-->
    74. <!-- Start Content -->
    75. <td>
    76. <table width="625" height= "637" border="0" cellspacing="0" cellpadding="0" align="left">
    77. <tr>
    78. <th colspan="3" width="625" height="14"><img src="Bilder/latestwars.jpg" alt="latestwars"></th>
    79. </tr>
    80. <tr>
    81. <td><img src="Bilder/spacer10.jpg" alt="spacer10"></td>
    82. <!-- Start Table Latestwars -->
    83. <td>
    84. <table width="405" height= "128" border="0" cellspacing="0" cellpadding="0" background= "Bilder/bg-wars.jpg" align="left">
    85. <tr>
    86. <td>&nbsp;</td>
    87. </tr>
    88. </table>
    90. </td>
    91. <!-- End Table Latestwars -->
    92. <td><img src="Bilder/spacer11.jpg" alt="spacer11"></td>
    93. </tr>
    94. <tr>
    95. <th colspan="3"><img src="Bilder/spacer12.jpg" alt="spacer12"></th>
    96. </tr>
    97. <tr>
    98. <td><img src="Bilder/spacer5.jpg" alt="spacer5"></td>
    99. <!-- Start Table Content Text -->
    100. <td>
    101. <table width="536" height= "455" border="0" cellspacing="0" cellpadding="0" align="left" background= "Bilder/bg-content.jpg">
    102. <tr>
    103. <td>&nbsp;</td>
    104. </tr>
    105. </table>
    106. </td>
    107. <!-- End Table Content Text -->
    108. <td><img src="Bilder/spacer20.jpg" alt="spacer20"></td>
    109. </tr>
    110. </table>
    112. </td>
    113. <!-- End Content -->
    114. <!-- Start Navi Rechts -->
    115. <td>
    116. <table width="180" height= "637" border="0" cellspacing="0" cellpadding="0" align="left">
    117. <tr>
    118. <td><img src="Bilder/sponsoren.jpg" alt="sponsoren"></td>
    119. </tr>
    120. <!-- Start Sponsoren Text Table -->
    121. <tr>
    122. <td>
    123. <table width="180" height= "186" align="left" background= "Bilder/bg-sponsoren.jpg" border="0" cellspacing="0" cellpadding="0">
    124. <tr>
    125. <td>&nbsp;</td>
    126. </tr>
    127. </table>
    128. </td>
    129. </tr>
    130. <!-- End Sponsoren Text Table -->
    131. <tr>
    132. <td><img src="Bilder/shoutbox.jpg" alt="shoutbox"></td>
    133. </tr>
    134. <!-- Start Shoutbox Code Table -->
    135. <tr>
    136. <td>
    137. <table width="180" border="0" cellspacing="0" cellpadding="0">
    138. <tr>
    139. <td>&nbsp;</td>
    140. </tr>
    141. </table>
    142. </td>
    143. </tr>
    144. <!-- End Shoutbox Code Table -->
    145. <tr>
    146. <td><img src="Bilder/spacer21.jpg" alt="spacer21"></td>
    147. </tr>
    148. </table>
    150. </td>
    151. <!-- End Navi Rechts -->
    152. </tr>
    153. </table>
    154. <!-- End Main Table-->
    155. </body>
    156. </html>
    Alles anzeigen


    Würde mich freuen wenn ich mir helfen könnt!

    MFG
    Chris4u

  • diesmal sind die html nicht mehr so gravierend.. vielleicht liegts einfach am design

    erstell doch erstmal eine seite mit dem einzelnen logoe und einer tabelle mit 3 spalten
    ~logo~
    |-----------------------|
    | | | |
    | | | |
    | | | |
    | | | |
    |-----------------------|


    in die linke spalte pakst du die tabelle mit den ~15 zeilen und nur einer spalte
    und in die rechte spalte packst du noch eine extra tabelle mit sponsorn und shoutbox..

    in die css packst du

    Quellcode

    1. tr {
    2. vertical-align:top;
    3. }


    und fertig ist die seite

  • So und hier ist der 7te test versuch:

    test seite: http://www.b2kclan.org/test7.html


    Und hier der Quellcode

    HTML-Quellcode

    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    2. <html>
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    5. <title>Untitled Document</title>
    7. <style type="text/css">
    8. tr {
    9. vertical-align:top ;
    10. }
    11. </style>
    12. </head>
    14. <body leftmargin="0" topmargin="0" marginheight="0" marginwidth="0">
    15. <!-- Anfang Grund Tabelle -->
    16. <table width="1024" border="0" cellspacing="0" cellpadding="0" align="left">
    17. <!-- Anfang Kopf -->
    18. <tr>
    19. <th colspan="3" width="1024" height="131" align="left"><img src="Bilder/head.jpg" alt="head" width="1024" height="131"></th>
    20. </tr>
    21. <!-- Ende Head -->
    22. <!-- Start Navi Links Tabelle -->
    23. <tr>
    24. <td width="219" height="637" align="left">
    25. <table width="219" border="0" cellspacing="0" cellpadding="0" align="left">
    26. <tr>
    27. <td><img src="Bilder/main.jpg" alt="main"></td>
    28. </tr>
    29. <tr>
    30. <td><img src="Bilder/spacer17.jpg" alt="news"></td>
    31. </tr>
    32. <tr>
    33. <td><img src="Bilder/board.jpg" alt="board"></td>
    34. </tr>
    35. <tr>
    36. <td><img src="Bilder/server.jpg" alt="server"></td>
    37. </tr>
    38. <tr>
    39. <td><img src="Bilder/guestbook.jpg" alt="guestbook"></td>
    40. </tr>
    41. <tr>
    42. <td><img src="Bilder/downloads.jpg" alt="downloads"></td>
    43. </tr>
    44. <tr>
    45. <td><img src="Bilder/spacer1.jpg" alt="spacer1"></td>
    46. </tr>
    47. <tr>
    48. <td><img src="Bilder/clan-menu.jpg" alt="clan-menu"></td>
    49. </tr>
    50. <tr>
    51. <td><img src="Bilder/members.jpg" alt="members"></td>
    52. </tr>
    53. <tr>
    54. <td><img src="Bilder/history.jpg" alt="history"></td>
    55. </tr>
    56. <tr>
    57. <td><img src="Bilder/rules.jpg" alt="rules"></td>
    58. </tr>
    59. <tr>
    60. <td><img src="Bilder/spacer2.jpg" alt="spacer2"></td>
    61. </tr>
    62. <tr>
    63. <td><img src="Bilder/contact-menu.jpg" alt="contact-menu"></td>
    64. </tr>
    65. <tr>
    66. <td><img src="Bilder/contact-us.jpg" alt="contact-us"></td>
    67. </tr>
    68. <tr>
    69. <td><img src="Bilder/joinus.jpg" alt="joinus"></td>
    70. </tr>
    71. <tr>
    72. <td><img src="Bilder/fightus.jpg" alt="fightus"></td>
    73. </tr>
    74. <tr>
    75. <td><img src="Bilder/spacer4.jpg" alt="spacer4"></td>
    76. </tr>
    77. </table>
    78. </td>
    79. <!-- Ende Navi Links Tabelle -->
    80. <!-- Anfang Text Tabelle -->
    81. <td align="left" width="625" height="637">
    82. <table width="100%" border="0" cellspacing="0" cellpadding="0" align="left">
    83. <tr>
    84. <th colspan="3" align="left" width="625"><img src="Bilder/latestwars.jpg" alt="latestwars"></th>
    85. </tr>
    86. <tr>
    87. <td align="left" width="102"><img src="Bilder/spacer10.jpg" alt="spacer10"></td>
    88. <td align="left" width="405">&nbsp;</td>
    89. <td align="left" width="118"><img src="Bilder/spacer11.jpg" alt="spacer11"></td>
    90. </tr>
    91. <tr>
    92. <th colspan="3" align="left"><img src="Bilder/spacer12.jpg" alt="spacer12"></th>
    93. </tr>
    94. <tr>
    95. <td align="left" width="49"><img src="Bilder/spacer5.jpg" alt="spacer5"></td>
    96. <td align="left" width="536"><img src="Bilder/bg-content.jpg"></td>
    97. <td align="left" width="40"><img src="Bilder/spacer20.jpg" alt="spacer20"></td>
    98. </tr>
    99. </table>
    100. </td>
    101. <!-- Ende Text Tabelle -->
    102. <!-- Anfang Navi Rechts Tabelle -->
    103. <td width="180" height="637" align="left">
    104. <table width="180" border="0" cellspacing="0" cellpadding="0" align="left">
    105. <tr>
    106. <td align="left"><img src="Bilder/sponsoren.jpg" alt="sponsoren">;</td>
    107. </tr>
    108. <tr>
    109. <td width="180" height="186">&nbsp;</td>
    110. </tr>
    111. <tr>
    112. <td align="left"><img src="Bilder/shoutbox.jpg" alt="shoutbox"></td>
    113. </tr>
    114. <tr>
    115. <td width="180" height="299">&nbsp;</td>
    116. </tr>
    117. <tr>
    118. <td align="left"><img src="Bilder/spacer21.jpg" alt="spacer21"></td>
    119. </tr>
    120. </table>
    121. </td>
    122. <!-- Ende Navi Rechts Tabelle -->
    123. </tr>
    124. </table>
    125. <!-- Ende Grund Tabelle -->
    126. </body>
    127. </html>
    Alles anzeigen