Jagognussel: Warum habe ich einen Scrollbalken ?

Hi Leute!

Habe mich redlich bemüht Fehler zu vermeiden. Dennoch, eine Kleinigkeit ist leider oberfaul! Obwohl die HTML-Seite, wie auch mein Stylesheet valide sind, habe ich durch meine obere Navigation einen Scrollbalken unten.

Entferne ich die NAV mittels: "<!-- -->" ist der Scrollbalken weg.

Hat da einer ne Ahnung, wo ich den Bock geschossen habe?

------------------------------------------------

Die HTML-Seite:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html lang="de">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15">
 <meta http-equiv="Content-Script-Type" content="text/javascript">
 <meta http-equiv="Content-Style-Type" content="text/css">
<TITLE>Verwaltungsgesellschaft, Unternehmensberatung, Immobilien, Rechnungswesen</TITLE>
 <meta name="GENERATOR" content="Mozilla/4.73 [de]C-CCK-MCD QXW0324c  (Win98; U) [Netscape]">
 <meta name="robots" content="index">
 <meta name="robots" content="follow">
 <meta name="language" content="deutsch, de">

<!-- META - ANGABEN -->

<link href="css.css" rel="stylesheet" type="text/css">

<style type="text/css">  <!--
  }
  #table {
   left : 185px;
   top : 155px;
   position : absolute;
  }
  td {
   scrollbar-arrow-color : #F2F2F2;
   scrollbar-face-color : #28195E;
   scrollbar-base-color : #28195E;
  }
-->
</style>
</head>
<body style="background-color: #F2F2F2;">
<!-- <a name="top" class="invis"> </a>
<a href="#anfang" class="invis">Zum Artikel springen</a>-->
<!--<div id="top"> </div>-->
<div id="wrapper">

<div id="content">
<!-- TopMenu  -->
<p class="mainmenue">
<a href="index.htm" target="_self">..: UNTERNEHMEN :..</a>
<a href="htm/struktur.htm">..: UNTERNEHMENSSTRUKTUR :..</a>
<a href="htm/kontakt.php">..: KONTAKT :..</a>
</p>
<!-- TopMenu ENDE -->
<!-- LeftMenue -->
<div id="leftmenue">
<ul>
<li>&nbsp;&nbsp;&nbsp;Dienstleistungen:<br></li>
<li><a href="htm/beratung.htm">&nbsp;&nbsp;&nbsp;Unternehmensberatung</a></li>
<li><a href="htm/immobil.htm">&nbsp;&nbsp;&nbsp;Immobilienberatung</a></li>
<li><br>&nbsp;&nbsp;&nbsp;Services:<br></li>
<li><a href="htm/rechnung.htm">&nbsp;&nbsp;&nbsp;Rechnungswesen</a></li>
<li><a href="htm/gehalt.htm">&nbsp;&nbsp;&nbsp;Gehaltsservice</a></li>
<li><a href="mailto:info@rothe-verwaltung.de?subject=Informationsanfrage">&nbsp;&nbsp;&nbsp;e-Mail</a></li>
<li><a href="htm/impress.htm">&nbsp;&nbsp;&nbsp;Impressum</a></li>
<li><br><br>&nbsp;&nbsp;&nbsp;<img src="objects/ch_hand2.jpg" width="136" height="92" alt="Auf Vertrauen!" border="0"></li>
</ul>
</div>
<!-- LeftMenue ENDE  -->

<div id="table">
 <table border="0">
    <tr>
        <td>
          <div style="overflow:auto;width:570px; height:300px;">
<table border="0">
<tr>
 <td width="350"><h2>Herzlich Willkommen auf unserer Homepage!<br><br></h2></td>
 <td width="180" rowspan="3" align="center"><img src="objects/sky01.jpg" width="173" height="273" alt="Skyline Frankfurt am Main" border="0"></td>
</tr>
<tr>
 <td><h3></h3></td>
</tr>
<tr>
 <td> <p>Wir sind ein dienstleistungsorientiertes Beratungsunter-<br>nehmen und betreuen deutschlandweit Unternehmen bei<br>Ihren Gesch&auml;ftsaktivit&auml;ten.<br><br>Durch unsere Leistungen unterst&uuml;tzen wir Sie in den Bereichen Rechnungswesen, Lohn- u. Gehaltsservice sowie Unternehmensberatung.<br><br>Die Zufriedenheit unserer Kunden und die Steigerung Ihres wirtschaftlichen Erfolges ist uns Auftrag und Verpflichtung zugleich.<br><br>Wir setzen auf wertorientierte Zusammenarbeit in allen Unternehmensbereichen.</p></td>
</tr>
<tr>
 <td colspan="2"></td>
</tr>
</table>
</div>
        </td>
    </tr>
</table>
</div>
 </div><!-- content ENDE -->
 <div id="footer">
<p></p>
 </div>
</div><!-- id=wrapper -->
</body>
</html>

-------------------------------------------------

CSS:
html, body {
margin: 0;
padding: 0;
}
body {
background-color: #F7FCF6;
font-family: Verdana, Helvetica, sans-serif;
font-size: 101%;
text-align: center;/*fuer IE_quirks*/
}

/* mainboxes */
#wrapper {
 position: relative;
 margin: 10px auto;
 width: 780px;
 background-color: transparent;
 color: #000066;
 text-align: left;
 /*Aufheben von IE_quirks im BODY*/

}

dl, dt, dd, ul, li {
 margin: 0;
 padding: 0;
 list-style-type: none;
}

#leftmenue {
 position: relative;
 top: 140px;
 left: 10px;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
 font-size : 10px;
 color : #E8E8FF;
}

#content {
 background-color: transparent;
 background-image : url(objects/bg.jpg);
 background-repeat : no-repeat;
 font-family: Verdana, Helvetica, sans-serif;
 color: #000066;
 border: 0px;
 padding: 5px 0px 5px 0px;
 height : 500px;
}

#footer {
 background-color: transparent;
 font-family: Verdana, Helvetica, sans-serif;
 border: 0px;
 margin: 4px 0px 0px 10px;
 padding: 5px;
 position : relative;
 top : -41px;
}
/* setzt alles auf 0 */
h1, h2, h3, h4, h5, h6,  p  {
 margin: 0;
 padding: 0;
}

h1 {
 color: #6B6B6B;
 font-size: 13px;
 letter-spacing: 2pt;
}
h2 {
 color: #6B6B6B;
 font-size: 12px;
}
h3 {
 font-size: 11px;
 color: #6B6B6B;
}
h4 {
 font-size: 11px;
 color : #8080FF;
}

/* Texte */
p {
 font-size: 65%;
}
#content p {
 line-height: 150%;
 margin: 7px 0px 8px 0px;
 color: #6B6B6B;
}
 #teaser p {
 padding: 10px 5px 0px 10px;
}

/*  TOPmenu  ANFANG*/
p.mainmenue {
 color: #F0F0F0;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
 font-size : 10px;
 left : 300px;
 top : 117px;
 position : relative;
}
/*  TOPmenu  ANFANG*/

/*  LEFTmenu  ANFANG*/
#leftmenue ul li {
 list-style-type: none;
}
#leftmenue a {
 display: block;
 text-decoration: none;
 width: 150px;
 margin: 2px 0;
 padding: 5px 0 2px 5px;
 font-weight: bold;
 background-color: transparent;
 color: #E1E1E1;
 border-top: 0px;
 border-left: 5px solid #28195E;
 border-right: 0px;
 border-bottom: 0px;
 font-size : 10px;
}
#leftmenue a:hover {
 display: block;
 background-color: #28195E;
 border-left: 5px solid #FFF;
 color: #C1C1E1;
}
/* LEFTmenu ENDE  */

/* Links */
#content a {
 text-decoration: none;
 padding: 0px 3px 2px 3px;
 border-right: 0px;
 border-bottom: 0px ;
 background-color: transparent;
 color: #8080FF;
}
#content a:link {
 background-color: transparent;
 color: #8080FF;
}
#content a:visited {
 color: #DFFFFF;
}
#content a:hover {
 color: #FFF2E6;
}

span.s1 {
 color: #000066;
 font-size : 11px;
 font-weight : bolder;
}
span.s2 {
 color: #FF6600;
 font-size : 14px;
 font-weight : bolder;
}
#footer a {
 text-decoration: none;
 margin: 1px 0px 1px 0px;
 padding: 0px 3px 0px 3px;
 border: 0px;
 font-size : 9px;
 font-weight : bolder;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#footer p {
 background-color: transparent;
 color: #FFFFFF;
}
#footer a:link {
 background-color: transparent;
 color: #F2F2F2;
}
#footer a:visited {
 color: #D9FFFF;
}
#footer a:hover {
 color: #FFF0E6;
}
#footer a:active {
 color: #FFFFD7;
}
/* others */
.invis, hr {
 display: none;
}

img {
 border: none;
}

  1. Wer overflow:auto und feste Höhen benutzt, sollte sich nicht wundern, wenn er möglicherweise einen Scrollbalken sieht.

    Gruß, LX

    --
    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: Unusual
    X-Please-Search-Archive-First: Absolutely Yes
    1. Wer overflow:auto und feste Höhen benutzt, sollte sich nicht wundern, wenn er möglicherweise einen Scrollbalken sieht.

      Gruß, LX

      Ähhh - wie ?

      Wo habe ich denn ein "overflow:auto" ? Und, was hat die Höhe mit dem wagerechten Scollbalken zu tun ? Ich wäre Dir sehr dankbar, wenn Du mir deutlichere Infos zukommen lassen könntest. Danke.

      Jagognussel

      1. Nabend!

        Wo habe ich denn ein "overflow:auto" ?

        Beispielsweise hier:

        <div style="overflow:auto;width:570px; height:300px;">

        <erbsenzähler>

        Gratisinfo: Leerzeichen zwischen Satzende und Satzzeichen (wie beispielsweise nach ? und !) machen übrigens die Franzosen - wir aber nicht.

        </erbsenzähler>

        File Griese,

        Stonie

        --
        It's no good you trying to sit on the fence
        And hope that the trouble will pass
        'Cause sitting on fences can make you a pain in the ass.
        Und im Übrigen kennt auch Stonie Wayne.
  2. Hallo,

    Warum ist das den so schlimm, wenn du einen Scrollbalken hast ?

    MfG. Christoph

    --
    Wo die Sprache aufhört, fängt die Musik an...
    Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
    Go to this
    1. Hallo,

      Warum ist das den so schlimm, wenn du einen Scrollbalken hast ?

      MfG. Christoph

      Hallöle!

      Recht einfach! Warum soll man scollen können, wenn kein Inhalt dafür vorhanden ist. Er macht also keinen Sinn und daher wie Wasser - überflüssig !

      Gruß
      Jagognussel

  3. Hi Leute!

    Habe mich redlich bemüht Fehler zu vermeiden. Dennoch, eine Kleinigkeit ist leider oberfaul! Obwohl die HTML-Seite, wie auch mein Stylesheet valide sind, habe ich durch meine obere Navigation einen Scrollbalken unten.

    Entferne ich die NAV mittels: "<!-- -->" ist der Scrollbalken weg.

    Hat da einer ne Ahnung, wo ich den Bock geschossen habe?


    Die HTML-Seite:

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
    <html lang="de">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <TITLE>Verwaltungsgesellschaft, Unternehmensberatung, Immobilien, Rechnungswesen</TITLE>
    <meta name="GENERATOR" content="Mozilla/4.73 [de]C-CCK-MCD QXW0324c  (Win98; U) [Netscape]">
    <meta name="robots" content="index">
    <meta name="robots" content="follow">
    <meta name="language" content="deutsch, de">

    <!-- META - ANGABEN -->

    <link href="css.css" rel="stylesheet" type="text/css">

    <style type="text/css">  <!--
      }
      #table {
       left : 185px;
       top : 155px;
       position : absolute;
      }
      td {
       scrollbar-arrow-color : #F2F2F2;
       scrollbar-face-color : #28195E;
       scrollbar-base-color : #28195E;
      }
    -->
    </style>
    </head>
    <body style="background-color: #F2F2F2;">
    <!-- <a name="top" class="invis"> </a>
    <a href="#anfang" class="invis">Zum Artikel springen</a>-->
    <!--<div id="top"> </div>-->
    <div id="wrapper">

    <div id="content">
    <!-- TopMenu  -->
    <p class="mainmenue">
    <a href="index.htm" target="_self">..: UNTERNEHMEN :..</a>
    <a href="htm/struktur.htm">..: UNTERNEHMENSSTRUKTUR :..</a>
    <a href="htm/kontakt.php">..: KONTAKT :..</a>
    </p>
    <!-- TopMenu ENDE -->
    <!-- LeftMenue -->
    <div id="leftmenue">
    <ul>
    <li>&nbsp;&nbsp;&nbsp;Dienstleistungen:<br></li>
    <li><a href="htm/beratung.htm">&nbsp;&nbsp;&nbsp;Unternehmensberatung</a></li>
    <li><a href="htm/immobil.htm">&nbsp;&nbsp;&nbsp;Immobilienberatung</a></li>
    <li><br>&nbsp;&nbsp;&nbsp;Services:<br></li>
    <li><a href="htm/rechnung.htm">&nbsp;&nbsp;&nbsp;Rechnungswesen</a></li>
    <li><a href="htm/gehalt.htm">&nbsp;&nbsp;&nbsp;Gehaltsservice</a></li>
    <li><a href="mailto:info@rothe-verwaltung.de?subject=Informationsanfrage">&nbsp;&nbsp;&nbsp;e-Mail</a></li>
    <li><a href="htm/impress.htm">&nbsp;&nbsp;&nbsp;Impressum</a></li>
    <li><br><br>&nbsp;&nbsp;&nbsp;<img src="objects/ch_hand2.jpg" width="136" height="92" alt="Auf Vertrauen!" border="0"></li>
    </ul>
    </div>
    <!-- LeftMenue ENDE  -->

    <div id="table">
    <table border="0">
        <tr>
            <td>
              <div style="overflow:auto;width:570px; height:300px;">
    <table border="0">
    <tr>
    <td width="350"><h2>Herzlich Willkommen auf unserer Homepage!<br><br></h2></td>
    <td width="180" rowspan="3" align="center"><img src="objects/sky01.jpg" width="173" height="273" alt="Skyline Frankfurt am Main" border="0"></td>
    </tr>
    <tr>
    <td><h3></h3></td>
    </tr>
    <tr>
    <td> <p>Wir sind ein dienstleistungsorientiertes Beratungsunter-<br>nehmen und betreuen deutschlandweit Unternehmen bei<br>Ihren Gesch&auml;ftsaktivit&auml;ten.<br><br>Durch unsere Leistungen unterst&uuml;tzen wir Sie in den Bereichen Rechnungswesen, Lohn- u. Gehaltsservice sowie Unternehmensberatung.<br><br>Die Zufriedenheit unserer Kunden und die Steigerung Ihres wirtschaftlichen Erfolges ist uns Auftrag und Verpflichtung zugleich.<br><br>Wir setzen auf wertorientierte Zusammenarbeit in allen Unternehmensbereichen.</p></td>
    </tr>
    <tr>
    <td colspan="2"></td>
    </tr>
    </table>
    </div>
            </td>
        </tr>
    </table>
    </div>
    </div><!-- content ENDE -->
    <div id="footer">
    <p></p>
    </div>
    </div><!-- id=wrapper -->
    </body>
    </html>

    
    > -------------------------------------------------  
    >   
    > CSS:  
      
    ~~~css
      
    
    > html, body {  
    > margin: 0;  
    > padding: 0;  
    > }  
    > body {  
    > background-color: #F7FCF6;  
    > font-family: Verdana, Helvetica, sans-serif;  
    > font-size: 101%;  
    > text-align: center;/*fuer IE_quirks*/  
    > }  
    >   
    > /* mainboxes */  
    > #wrapper {  
    >  position: relative;  
    >  margin: 10px auto;  
    >  width: 780px;  
    >  background-color: transparent;  
    >  color: #000066;  
    >  text-align: left;  
    >  /*Aufheben von IE_quirks im BODY*/  
    >   
    > }  
    >   
    > dl, dt, dd, ul, li {  
    >  margin: 0;  
    >  padding: 0;  
    >  list-style-type: none;  
    > }  
    >   
    > #leftmenue {  
    >  position: relative;  
    >  top: 140px;  
    >  left: 10px;  
    >  font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;  
    >  font-size : 10px;  
    >  color : #E8E8FF;  
    > }  
    >   
    > #content {  
    >  background-color: transparent;  
    >  background-image : url(objects/bg.jpg);  
    >  background-repeat : no-repeat;  
    >  font-family: Verdana, Helvetica, sans-serif;  
    >  color: #000066;  
    >  border: 0px;  
    >  padding: 5px 0px 5px 0px;  
    >  height : 500px;  
    > }  
    >   
    > #footer {  
    >  background-color: transparent;  
    >  font-family: Verdana, Helvetica, sans-serif;  
    >  border: 0px;  
    >  margin: 4px 0px 0px 10px;  
    >  padding: 5px;  
    >  position : relative;  
    >  top : -41px;  
    > }  
    > /* setzt alles auf 0 */  
    > h1, h2, h3, h4, h5, h6,  p  {  
    >  margin: 0;  
    >  padding: 0;  
    > }  
    >   
    > h1 {  
    >  color: #6B6B6B;  
    >  font-size: 13px;  
    >  letter-spacing: 2pt;  
    > }  
    > h2 {  
    >  color: #6B6B6B;  
    >  font-size: 12px;  
    > }  
    > h3 {  
    >  font-size: 11px;  
    >  color: #6B6B6B;  
    > }  
    > h4 {  
    >  font-size: 11px;  
    >  color : #8080FF;  
    > }  
    >   
    > /* Texte */  
    > p {  
    >  font-size: 65%;  
    > }  
    > #content p {  
    >  line-height: 150%;  
    >  margin: 7px 0px 8px 0px;  
    >  color: #6B6B6B;  
    > }  
    >  #teaser p {  
    >  padding: 10px 5px 0px 10px;  
    > }  
    >   
    > /*  TOPmenu  ANFANG*/  
    > p.mainmenue {  
    >  color: #F0F0F0;  
    >  font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;  
    >  font-size : 10px;  
    >  left : 300px;  
    >  top : 117px;  
    >  position : relative;  
    > }  
    > /*  TOPmenu  ANFANG*/  
    >   
    > /*  LEFTmenu  ANFANG*/  
    > #leftmenue ul li {  
    >  list-style-type: none;  
    > }  
    > #leftmenue a {  
    >  display: block;  
    >  text-decoration: none;  
    >  width: 150px;  
    >  margin: 2px 0;  
    >  padding: 5px 0 2px 5px;  
    >  font-weight: bold;  
    >  background-color: transparent;  
    >  color: #E1E1E1;  
    >  border-top: 0px;  
    >  border-left: 5px solid #28195E;  
    >  border-right: 0px;  
    >  border-bottom: 0px;  
    >  font-size : 10px;  
    > }  
    > #leftmenue a:hover {  
    >  display: block;  
    >  background-color: #28195E;  
    >  border-left: 5px solid #FFF;  
    >  color: #C1C1E1;  
    > }  
    > /* LEFTmenu ENDE  */  
    >   
    >   
    >   
    >   
    > /* Links */  
    > #content a {  
    >  text-decoration: none;  
    >  padding: 0px 3px 2px 3px;  
    >  border-right: 0px;  
    >  border-bottom: 0px ;  
    >  background-color: transparent;  
    >  color: #8080FF;  
    > }  
    > #content a:link {  
    >  background-color: transparent;  
    >  color: #8080FF;  
    > }  
    > #content a:visited {  
    >  color: #DFFFFF;  
    > }  
    > #content a:hover {  
    >  color: #FFF2E6;  
    > }  
    >   
    > span.s1 {  
    >  color: #000066;  
    >  font-size : 11px;  
    >  font-weight : bolder;  
    > }  
    > span.s2 {  
    >  color: #FF6600;  
    >  font-size : 14px;  
    >  font-weight : bolder;  
    > }  
    > #footer a {  
    >  text-decoration: none;  
    >  margin: 1px 0px 1px 0px;  
    >  padding: 0px 3px 0px 3px;  
    >  border: 0px;  
    >  font-size : 9px;  
    >  font-weight : bolder;  
    >  font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;  
    > }  
    > #footer p {  
    >  background-color: transparent;  
    >  color: #FFFFFF;  
    > }  
    > #footer a:link {  
    >  background-color: transparent;  
    >  color: #F2F2F2;  
    > }  
    > #footer a:visited {  
    >  color: #D9FFFF;  
    > }  
    > #footer a:hover {  
    >  color: #FFF0E6;  
    > }  
    > #footer a:active {  
    >  color: #FFFFD7;  
    > }  
    > /* others */  
    > .invis, hr {  
    >  display: none;  
    > }  
    >   
    > img {  
    >  border: none;  
    > }