Hello...We are new here and we apologize if we overlooked this question but we are having difficulty with our site layout. We are attempting to create a scrollbar in our table so that everything inside doesn't take up the whole site and also so that we don't have to create multiple pages and take up space.

If you could help, please let us know.. Thank you for your time :) (code below) Please let us know how we could integrate a scrollbar so that the information within the table doesn't take up space etc as we described above. Thank you SO much!

<style type="text/css">
<!--
.over {
background-image: url(images/bsgdgdagfasdgagsdg.gif);
}
-->
  </style>
  <style type="text/css">
<!--
.sideborders {
border-right-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #383A2E;
border-left-color: #383A2E;
}
-->
  </style>
  <style type="text/css">
<!--
input {
background-color: 4F5143;
border: 1px solid;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
color: #B5B5B5;
}
-->
  </style>
  <style type="text/css">
<!--
a:link {
color: #B5B5B5;
text-decoration: none;
}
a:hover {
color: #B5B5B5;
text-decoration: underline;
}
a:visited {
color: #B5B5B5;
text-decoration: none;
}
-->
  </style>
</head>
<body topmargin="0" leftmargin="0" rightmargin="0"
 style="color: rgb(181, 181, 181); background-color: rgb(79, 81, 67);">
<table border="0" cellpadding="0" cellspacing="0"
 width="100%">
  <tbody>
    <tr>
      <td background="images/headerbghoriz.gif" height="158"
 valign="top" width="61">
      <div align="left"><img
 src="images/leftpixeltech.gif" height="155" width="61"></div>
      </td>
      <td background="images/headerbghoriz.gif" valign="top">
      <div align="center">
      <table border="0" cellpadding="0" cellspacing="0"
 width="100%">
        <tbody>
          <tr>
            <td valign="top">
            <div align="center"><img
 style="width: 839px; height: 128px;" src="images/header.jpg"></div>
            </td>
          </tr>
          <tr>
            <td>
            <table align="center" border="0"
 cellpadding="0" cellspacing="0">
              <tbody>
                <tr>
                  <td background="images/leftnavbutton.gif"
 height="30" width="127">
                  <table border="0" cellpadding="0"
 cellspacing="0" width="100%">
                    <tbody>
                      <tr>
                        <td height="4"></td>
                      </tr>
                      <tr>
                        <td>
                        <div align="center"><font
 color="#b5b5b5" face="Verdana, Arial, Helvetica, sans-serif"
 size="1">&nbsp;&nbsp;&nbsp;&nbsp;link one
here</font></div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                  </td>
                  <td><img src="images/navsep.gif"></td>
                  <td background="images/navbutton.gif"
 height="30" width="111">
                  <table border="0" cellpadding="0"
 cellspacing="0" width="100%">
                    <tbody>
                      <tr>
                        <td height="4"></td>
                      </tr>
                      <tr>
                        <td>
                        <div align="center"><font
 color="#b5b5b5" face="Verdana, Arial, Helvetica, sans-serif"
 size="1">link two here</font></div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                  </td>
                  <td><img src="images/navsep.gif"></td>
                  <td background="images/navbutton.gif"
 height="30" width="111">
                  <table border="0" cellpadding="0"
 cellspacing="0" width="100%">
                    <tbody>
                      <tr>
                        <td height="4"></td>
                      </tr>
                      <tr>
                        <td>
                        <div align="center"><font
 color="#b5b5b5" face="Verdana, Arial, Helvetica, sans-serif"
 size="1">link three here</font></div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                  </td>
                  <td><img src="images/navsep.gif"></td>
                  <td background="images/navbutton.gif"
 height="30" width="111">
                  <table border="0" cellpadding="0"
 cellspacing="0" width="100%">
                    <tbody>
                      <tr>
                        <td height="4"></td>
                      </tr>
                      <tr>
                        <td>
                        <div align="center"><font
 color="#b5b5b5" face="Verdana, Arial, Helvetica, sans-serif"
 size="1">link four here</font></div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                  </td>
                  <td><img src="images/navsep.gif"></td>
                  <td background="images/rightnavbutton.gif"
 height="30" width="128">
                  <table border="0" cellpadding="0"
 cellspacing="0" width="100%">
                    <tbody>
                      <tr>
                        <td height="4"></td>
                      </tr>
                      <tr>
                        <td>
                        <div align="center"><font
 color="#b5b5b5" face="Verdana, Arial, Helvetica, sans-serif"
 size="1">link five here &nbsp;&nbsp;&nbsp;</font></div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                  </td>
                </tr>
              </tbody>
            </table>
            </td>
          </tr>
        </tbody>
      </table>
      </div>
      </td>
      <td background="images/headerbghoriz.gif" valign="top"
 width="61">
      <div align="right"><img
 src="images/rightpixeltech.gif" width="61"></div>
      </td>
    </tr>
  </tbody>
</table>
<table style="width: 962px; height: 45px;" border="0"
 cellpadding="0" cellspacing="0" width="962">
  <tbody>
    <tr>
      <td background="images/navbg.gif" height="26"
 valign="top"></td>
      <td background="images/navbg.gif" height="26"
 valign="top"></td>
      <td background="images/navbg.gif" height="26"
 valign="top"></td>
    </tr>
    <tr>
      <td background="images/navbgshadow.gif" height="11"></td>
      <td background="images/navbgshadow.gif" height="11"></td>
      <td background="images/navbgshadow.gif" height="11"></td>
    </tr>
  </tbody>
</table>
<table style="width: 959px; height: 611px;" border="0"
 cellpadding="0" cellspacing="0" width="959">
  <tbody>
    <tr>
      <td valign="top">
      <p>&nbsp;</p>
      <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      </p>
      <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp; <br>
      </p>
      </td>
      <td valign="top" width="100%">
      <table style="width: 805px; height: 174px;" border="0"
 cellpadding="0" cellspacing="5" width="805">
        <tbody>
          <tr>
            <td>
            <table align="center" border="0"
 cellpadding="0" cellspacing="0" width="100%">
              <tbody>
                <tr>
                  <td>
                  <table border="0" cellpadding="0"
 cellspacing="0" width="100%">
                    <tbody>
                      <tr>
                        <td background="images/mcbg.gif"
 valign="top">
                        <table style="width: 579px; height: 32px;"
 border="0" cellpadding="0" cellspacing="0">
                          <tbody>
                            <tr>
                              <td height="9">
                              <p align="left"><font
 color="#b5b5b5" face="Verdana, Arial, Helvetica, sans-serif"
 size="1">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;<span style="font-weight: bold; color: rgb(255, 255, 255);">Pricing
Details</span></font></p>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                  </td>
                </tr>
                <tr>
                  <td class="sideborders" bgcolor="#5c5e4f"
 height="20">
                  <div align="center"> </div>
                  </td>
                </tr>
                <tr>
                  <td class="sideborders"
 background="images/crbg.gif" height="36">
                  <div align="center">
                  <table style="width: 583px; height: 36px;"
 border="0" cellpadding="0" cellspacing="0">
                    <tbody>
                      <tr>
                        <td height="2"><font
 face="Verdana, Arial, Helvetica, sans-serif" size="1"><span
 style="color: rgb(255, 255, 255);">&nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp;Copyright
2007 - </span><span style="color: rgb(51, 204, 255);">Dudley's
Warehouse.com</span> <span style="color: rgb(255, 255, 255);">-
Modified by</span> <a
 href="TAKEN OUT"><span
 style="color: rgb(51, 204, 255);">TAKEN OUT</span></a></font></td>
                      </tr>
                    </tbody>
                  </table>
                  </div>
                  </td>
                </tr>
              </tbody>
            </table>
&nbsp; </td>
          </tr>
        </tbody>
      </table>
      <table style="width: 959px; height: 611px;" border="0"
 cellpadding="0" cellspacing="0" width="959">
        <tbody>
          <tr>
            <td valign="top">
            <p>&nbsp;</p>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <br>
            <table style="width: 805px; height: 174px;"
 border="0" cellpadding="0" cellspacing="5"
 width="805">
              <tbody>
                <tr>
                  <td>
                  <table align="center" border="0"
 cellpadding="0" cellspacing="0" width="100%">
                    <tbody>
                      <tr>
                        <td>
                        <table border="0" cellpadding="0"
 cellspacing="0" width="100%">
                          <tbody>
                            <tr>
                              <td background="images/mcbg.gif"
 valign="top">
                              <table
 style="width: 579px; height: 32px;" border="0"
 cellpadding="0" cellspacing="0">
                                <tbody>
                                  <tr>
                                    <td height="9">
                                    <p align="left"><font
 color="#b5b5b5" face="Verdana, Arial, Helvetica, sans-serif"
 size="1">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;<span style="font-weight: bold; color: rgb(255, 255, 255);">Pricing
Details</span></font></p>
                                    </td>
                                  </tr>
                                </tbody>
                              </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                        </td>
                      </tr>
                      <tr>
                        <td class="sideborders"
 bgcolor="#5c5e4f" height="20">
                        <div align="center"> List of the
banner
ads. </div>
                        </td>
                      </tr>
                      <tr>
                        <td class="sideborders"
 background="images/crbg.gif" height="36">
                        <div align="center">
                        <table style="width: 583px; height: 36px;"
 border="0" cellpadding="0" cellspacing="0">
                          <tbody>
                            <tr>
                              <td height="2"><font
 face="Verdana, Arial, Helvetica, sans-serif" size="1"><span
 style="color: rgb(255, 255, 255);">&nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp;Copyright
2007 - </span><span style="color: rgb(51, 204, 255);">TAKEN OUT</span> <span style="color: rgb(255, 255, 255);">-
Modified by</span> <a
 href="NAME TAKEN OUT"><span
 style="color: rgb(51, 204, 255);">TAKEN OUT</span></a></font></td>
                            </tr>
                          </tbody>
                        </table>
                        </div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
&nbsp; </td>
                </tr>
              </tbody>
            </table>
            </p>
            </td>
            <td valign="top" width="100%"> </td>
            <td valign="top"> <br>
            </td>
          </tr>
        </tbody>
      </table>
      </td>
      <td valign="top"> <br>
      </td>
    </tr>
  </tbody>
</table>

Recommended Answers

All 2 Replies

Without digging through almost 400 lines of partially unformatted html coding, I would say you should put your data in a scrollable div.

<div style="height:100px;overflow:auto;">
    <p>Text</p>
    <p>Text</p>
    <p>Text</p>
    <p>Text</p>
    <p>Text</p>
  </div>

you could also lose the table and redo the content in DIV's too which should cut down and simplify the code.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.