nok: Kleine Zwischenräume zwischen Header und Site

Hi,

ich habe jetzt schon lange und viel rumprobiert, aber komme nicht drauf wie ich den kleinen Zwischenraum zwischen dem Header-Teil und dem Site-Teil (=Navi, Inhalt, Werbung) wegbekomme. Hab jetzt schon fast allen Tag die Attribute: "marign:0px; padding:0px;" gegeben!

Habe hier mal den Relevanten Teil:
Seite:
     <body>
       <center>
          <div id="body">
           <table id="header"><!-- Header --></table>
           <table>
           <tr>
            <td id="navi"><!-- Navi --></td>
            <td id="site"><!-- Site --></td>
            <td id="werbung"><!-- Werbung --></td>
            </tr>
           </table>
           <table id="footer"><!-- Footer --></table>
          </div>
       </center>
     </body>

Css:
body { margin : 0px; padding : 0px; width : 100%; height : 100%; }

#body { width : 1000px; margin : 0px; padding : 0px; }
#header { width : 1000px; height : 150px; }
#navi { width : 130px; margin : 0px; padding : 0px; }
#site { width : 725px; height : auto; }
#werbung { width : 150px; height : auto; }
#footer { width : 1000px; height : 21px; }

Und die die es brauchen:
Hier Link zur Seite: http://projunkiesclan.emilia-user.ath.cx/area51/index2.php
Und kink zur css Datei: http://projunkiesclan.emilia-user.ath.cx/area51/css/template.css

Ich hoffe ihr könnt mir helfen!
Und schonmal thx im Vorraus

-mfg nok

  1. Hi,

    ich habe jetzt schon lange und viel rumprobiert, aber komme nicht drauf wie ich den kleinen Zwischenraum zwischen dem Header-Teil und dem Site-Teil (=Navi, Inhalt, Werbung) wegbekomme.

    indem Du erst mal die Tabellen eliminierst, die ergeben da nämlich nicht den geringsten Sinn. Erst nach Entfernung dieser Fehlerquelle ist eine Problemursache praktikabel.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi Cheatah,

      indem Du erst mal die Tabellen eliminierst, die ergeben da nämlich nicht den geringsten Sinn. Erst nach Entfernung dieser Fehlerquelle ist eine Problemursache praktikabel.

      Ich hab den Inhalt der Tabellen nur weggelassen, weil ich der Meinugn war, dass nicht für mein Problem nicht relevant ist. Sry falls ich dich verwirrt habe! Hier also die Tabellen mit Inhalt:

      <body>
             <center>

      <div id="body">
                     <table id="header">
                      <tr>
                      <!-- Header START -->
                       <td>
                        <!-- Platzhalter -->
                       </td>
                      <!-- Header ENDE -->
                      </tr>

      </table>
                     <table>
                      <tr>
                       <!-- Navi START -->
                       <td id="navi">
                        <a id="navi_marked" href="?section=games">-= Games =-</a>
                             <div id="subnavi_game">
                              <a  href="?section=pc">PC</a>

      <br /><a  href="?section=konsolen">Konsolen</a>
                              <br /><a  href="?section=emulation">Emulation</a>
                              <br /><a  href="?section=downloads">Downloads</a>
                              <br />
                             </div>
                             <br /><a href="?section=manganime">-= Manganime =-</a>
                             <br />

      <br />
                       </td>
                       <!-- Navi ENDE -->
                       <!-- Site START -->
                       <td id="site">
                        <table width="100%" border="1">
                              <tr width="100%">
                               <td width="75%">nok</td>

      <td width="25%">15.05.2004 20:45:30</td>
                              </tr>
                              <tr>
                               <td colspan="2" width="100%">
                                <h3>Yo ust interressante News!</h3>
                                Meine fresse ist das interressant
                               </td>
                              </tr>

      </table>
                             <br />
                             <a href="index2.php?section=games&seite=1">[1]</a>
                       </td>
                       <!-- Site ENDE -->
                       <!-- Werbung START -->
                       <td id="werbung">
                        -werbung-
                       </td>

      <!-- Werbung ENDE -->
                      </tr>
                     </table>
                     <table id="footer">
                      <tr>
                      <!-- Footer START -->
                       <td><center><a href="index2.php?section=impressum">&copy; 2003-2004 ProJunkies.com</a></center></td>
                      <!-- Footer ENDE -->

      </tr>
                     </table>
                </div>
             </center>
           </body>

      -enjoy nok

      1. Hi,

        indem Du erst mal die Tabellen eliminierst, die ergeben da nämlich nicht den geringsten Sinn. Erst nach Entfernung dieser Fehlerquelle ist eine Problemursache praktikabel.
        Ich hab den Inhalt der Tabellen nur weggelassen, weil ich der Meinugn war, dass nicht für mein Problem nicht relevant ist. Sry falls ich dich verwirrt habe!

        hast Du nicht. Es existieren hier keine tabellarischen Daten, also ist eine Tabelle nicht zu rechtfertigen. Eliminiere sie.

        <a href="index2.php?section=games&seite=1">[1]</a>

        Eine Entity namens "seite" ist in XHTML nicht vorhanden. Dies ist ein kritischer Fehler. Zudem solltest Du keine Elemente einsetzen, die als deprecated markiert sind, wie z.B. <center>.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. <a href="index2.php?section=games&seite=1">[1]</a>

          Eine Entity namens "seite" ist in XHTML nicht vorhanden.

          @Cheatah,
          Meinst du wirklich, nok versteht, was du damit meinst?

          @nok,
          Cheatah meint, du musst das & durch &amp; maskieren, also
          <a href="index2.php?section=games&amp;seite=1">[1]</a>

          Gunnar

          --
          "(Der Student) kann sich so völlig dem hingeben, was er naiv für die Computerwissenschaft hält, also der bloßen Verfeinerung seiner Programmiertechniken, daß er sich auf diese Weise effektiv daran hindert, etwas wirklich Wesentliches zu studieren."
          (Joseph Weizenbaum in "Die Macht der Computer und die Ohnmacht der Vernunft")
        2. Hi Cheatah,

          hast Du nicht. Es existieren hier keine tabellarischen Daten, also ist eine Tabelle nicht zu rechtfertigen. Eliminiere sie.

          hier habe ich mal ein paar Tabellen weggelassen:
               <body>
                 <center>
                    <div id="body">
                         <div id="header"></div>
                         <table>
                         <!-- Site Tabelle -->
                         </table>
                         <div id="footer"></div>
                    </div>
                 </center>
               </body>

          Eine Entity namens "seite" ist in XHTML nicht vorhanden. Dies ist ein kritischer Fehler. Zudem solltest Du keine Elemente einsetzen, die als deprecated markiert sind, wie z.B. <center>.

          Entschuldige die Frage, aber was ist ein Entity? Und "Seite" ist eine get-Variable (siehe PHP) die ich für die Seite übergebe.
          Und ich weiß dass das <center>-Tag nicht gern gesehen ist, bin jetzt zu faul das weg zu machen...

          -mfg nok

          1. Hi,

            hier habe ich mal ein paar Tabellen weggelassen:

            lass die restlich/n auch noch weg, sofern sie keine tabellarischen Daten beinhalten.

            Entschuldige die Frage, aber was ist ein Entity?

            http://de.selfhtml.org/xml/dtd/entities.htm

            Und "Seite" ist eine get-Variable (siehe PHP) die ich für die Seite übergebe.

            Nein, unter keinen Umständen kann das eine Variable sein. Allenfalls ist es ein URL-Parameter, aber niemals eine Variable. Nein, auch in PHP nicht, PHP kann nämlich auch nicht zaubern und HTTP plötzlich komplexe Datenmodelle beibringen. Und ein URL-Parameter ist es nicht, weil Du es durch das unkodierte &-Zeichen als (ungültige) Entity verpackt hast.

            Und ich weiß dass das <center>-Tag nicht gern gesehen ist, bin jetzt zu faul das weg zu machen...

            Und Du erwartest von mir, weniger faul zu sein?

            Cheatah

            --
            X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
            X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
            X-Will-Answer-Email: No
            X-Please-Search-Archive-First: Absolutely Yes
  2. Hallo,

    ich habe jetzt schon lange und viel rumprobiert, aber komme nicht drauf wie ich den kleinen Zwischenraum zwischen dem Header-Teil und dem Site-Teil (=Navi, Inhalt, Werbung) wegbekomme. Hab jetzt schon fast allen Tag die Attribute: "marign:0px; padding:0px;" gegeben!

    Gib der Haupttabelle einmal
    <table cellspacing="0" cellpadding="0">
    oder über CSS
    table {border-spacing:0;}
    td {padding:0;}

    Mit CSS könntest du es so lösen (Konzept):

    body {color:black; background-color:#cecece; margin:0; padding:0; text-align:center;}

    #body {width:1000px; margin:auto; padding-top:150px; background-image:url(../bilder/Benutzer1.gif); background-repeat:no-repeat; text-align:left; background-color:#838383;}
    #navi {float:left; background-image:url(../bilder/left.png); background-repeat:no-repeat; width:130px; text-align:center; min-height:130px;}
    #navi ul, #navi li {margin:0; padding-left:0; list-style-type:none;}
    #werbung {float:right; width:150px;}
    #site {margin-left:130px; margin-right:150px; padding:5px; background-color:#cecece;}
    #footer {clear:both; height:21px; font-size:13px; background-image:url(../bilder/footer_back.png);}

    <div id="body">

    <div id="navi">
    <ul>
    <li><a href="http://projunkiesclan.emilia-user.ath.cx/area51/index2.php?section=games">-= Games =-</a></li>
    <li><a href="http://projunkiesclan.emilia-user.ath.cx/area51/index2.php?section=manganime">-= Manganime =-</a></li>
    </ul>
    </div>

    <div id="werbung">
    <p>-werbung-</p>
    </div>

    <div id="site">

    <table width="100%" border="1">
    <tr>
    <td width="75%">nok</td>
    <td width="25%">17.07.2004 23:29:57</td>
    </tr>
    <tr>
    <td colspan="2" width="100%">
    <h3>Online!</h3>
    <p>Wir sind online!</p>
    </td>
    </tr>
    </table>

    <p><a href="http://projunkiesclan.emilia-user.ath.cx/area51/index2.php?section=&seite=1">[1]</a></p>

    </div>

    <div id="footer"><a href="http://projunkiesclan.emilia-user.ath.cx/area51/index2.php?section=impressum">&copy; 2003-2004 ProJunkies.com</a></div>

    Die Umsetung in #site ließe sich ebenfalls verbessern.

    Mathias

    1. ich habe jetzt schon lange und viel rumprobiert, aber komme nicht drauf wie ich den kleinen Zwischenraum zwischen dem Header-Teil und dem Site-Teil (=Navi, Inhalt, Werbung) wegbekomme. Hab jetzt schon fast allen Tag die Attribute: "marign:0px; padding:0px;" gegeben!

      Gib der Haupttabelle einmal
      <table cellspacing="0" cellpadding="0">

      Vielleicht hierzu zur Klärung noch der Selfhtml-Link:
      http://de.selfhtml.org/html/tabellen/gestaltung.htm#abstand

      oder über CSS
      table {border-spacing:0;}
      td {padding:0;}

      Die CSS-Eigenschaft border-spacing entspricht dem HTML-Attribut cellspacing.
      http://de.selfhtml.org/css/eigenschaften/tabellen.htm#border_spacing
      Die padding-Eigenschaft für die td-Elemente kommt dem Attribut cellpadding gleich.
      http://de.selfhtml.org/css/eigenschaften/innenabstand.htm

      body { ... text-align:center;}

      #body { ... margin:auto; ... text-align:left; ... }

      Dies sorgt für die Zentrierung des #body-divs, siehe http://aktuell.de.selfhtml.org/tippstricks/css/ausrichtung/.

      Das inhaltslose #head-div habe ich herausgeworfen. Wenn dort sowieso kein Inhalt hineinkommt, kann es die Grafik auch einfach eine Hintergrundgrafik von #body sein und das padding oben entsprechend angepasst werden:

      #body { ... padding-top:150px; background-image:url(../bilder/Benutzer1.gif); background-repeat:no-repeat; ... }

      Wenn Inhalt über die Kopfgrafik stehen soll, machst du es wie gehabt, jedoch mit einem div oder einem anderen Element anstatt einer Tabelle, je nach Inhalt.

      Mathias

      1. Hi Mathias,

        table {border-spacing:0;}

        ich danke dir und verbeuge mich vor deiner Weisheit!
        Das border-spacing:0px; war die Lösung! Da wäre ich wahrscheinlich nie draufgekommen! Respekt!

        -enjoy nok