Scroll bar code

Stiker · 04-14-2004

The infamous scroll bar. Why am i having so much troubles with such easy code. I read the code, i read some tutorials, i understand how the code works, and then i try it and it doesnt work for me...Why am i doomed...Anyway enough rambleing. I am having troubles with stupid scrollbars. I got the code but cant seem to find the right place to put it. How about this i am going to put all my code here for you to give suggestions and what not, i lvoe codeing but right now it is just plain pissing me off! I am not looking for someoen to do anythign for me even though it sounds like that in this post, just looking for a step in the right direction. CSS is still a bit confusing for me...gRrRrR

Here goes:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Welcome to The Kansas Beta Site</TITLE>
<style type="text/css">
td {
font-size: 75%;
font-family: sans-serif;
color: #ffffff;
}
table {
background-repeat: no-repeat;
background-position: center center
}

body {
SCROLLBAR-FACE-COLOR: #000000;
SCROLLBAR-HIGHLIGHT-COLOR: #000000;
SCROLLBAR-SHADOW-COLOR: #000000;
SCROLLBAR-3DLIGHT-COLOR: #000000;
SCROLLBAR-ARROW-COLOR: #ffffff;
SCROLLBAR-TRACK-COLOR: #000000;
SCROLLBAR-DARKSHADOW-COLOR: #000000;
}
#main
{
width:100%;
height:100%;
overflow:auto;
}

</style>
</head>

<body bgcolor="#FFFFFF">





<OBJECT classid="clsid

27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"
WIDTH=800 HEIGHT=135>
<PARAM NAME=movie VALUE="header.swf"> <PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#FFFFFF> <EMBED src="header.swf" quality=high bgcolor=#FFFFFF WIDTH=800 HEIGHT=135 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"></EMBED>
</OBJECT>




<table border="0" width="800" height="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" valign="top">
<table border="0" width="150" cellspacing="0" cellpadding="0">
<tr>
<td align="left" valign="top" height="50" width="150" style="padding-top: 5px; padding-bottom: 5px"><img src="topside.gif"></td>
</tr>
<tr>
<td align="left" valign="top" height="25" width="100" style="padding-left: 4px; font: italic 900 12px arial; color: #4A585E">:: Members ::</td>
</tr>
<tr>
<td align="left" valign="top" height="25" width="50" style="padding-left: 4px"><img src="name.gif"></td>
</tr>
<form name="kbonly" method="post" action="login.php">
<tr>
<td align="left" valign="top"><input type="text" name="name" id="loginName" maxlength="35"></td>
</tr>
<tr>
<td align="left" valign="top" height="25" width="75" style="padding-top: 5px"><img src="password.gif"></td>
</tr>
<td align="left" valign="top"><input type="password" name="password" id="loginPassword" maxlength="35"></td>
</tr>
<tr>
<td align="left" valign="top" height="25" width="75" style="padding-left: 23px; padding-top: 10px"><input type="image" value="send" src="submit.gif" alt="Sign In"></td>
</tr>
</form>
<tr>
<td align="left" valign="top" height="50" width="150" style="padding-top: 5px; padding-bottom: 5px"><img src="bottomside.gif"></td>
</tr>
</table>
</td>
<td align="left" valign="top" style="padding-left: 50px; padding-top: 20px">
<table border="0" width="0" height="0" cellspacing="0" cellpadding="0" background="homebox.gif">
<tr>
<td align="left" valign="top" height="500" width="550" style="padding-top: 5px; padding-bottom: 5px">
<table height="0" width="510">
<tr>
<td align="left" valign="top" height="100%" width="100%" style="padding: 40px">:: April 12, 2004 :: Welcome to the new Kansas Beta Website
<div id"=main">

:::: WOULD LIKE SCROLL BAR IN THIS TABLE BELOW ::::
<table>
<tr>
<td style="padding-top: 10px">- This is the new layout for the Sig Ep Kansas Beta webiste brought to you by
Ra1nn3 and Su^-^a productions. Much of the content is still being submited and coded
and will be brought to you shortly. In the mean time please browse through each page
to get a feel for the life here and K-State Kansas Beta. </td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>

</table>






</td>
</tr>
</table>

<OBJECT classid="clsid

27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"
WIDTH=800 HEIGHT=80>
<PARAM NAME=movie VALUE="bottom.swf"> <PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#FFFFFF> <EMBED src="bottom.swf" quality=high bgcolor=#FFFFFF WIDTH=800 HEIGHT=80 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"></EMBED>
</OBJECT>

</body>
</html>

It is flash cobine with html/CSS, my friend puts together the flash i am finishing it off with html/CSS/photoshop/php(if i ever find time to learn it)

I am tryign to put a scroll bar inside the table for the content box (aka homebox) I labled it above.

malboroman · 04-14-2004

What if you tried to put all the CSS in a different file... A CSS-file... Then it will look a lot clearer than it is now...

You just have to put this line in the page where you want you CSS applied:

Code:

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

Stiker · 04-15-2004

will do, also anyway have any suggestions on how to get my scroll bars to work, they currently surround my entire page and are not inside the single table i would like them to be in.

malboroman · 04-15-2004

you can't get a scrollbar in table... (this is a thing I learned here at biorust)
You can... however get a div to scroll.

you have to this code...

Code:

.scrolldiv {
overflow-x: hidden;                       //gets rid of the horizontal scrollbar
overflow: scroll;                            //if the content get too big, the scrollbar appears
width: 200px;                               //sets the width
height: 400px;                             //sets the height
visibility: visible;                          //makes it visible
scrollbar-3dlight-color: #000000;
scrollbar-arrow-color: #FFFFFF;
scrollbar-base-color: #000000;
scrollbar-darkshadow-color:#000000;
scrollbar-face-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
}

Then in the table you want to scroll you put this code:

Code:

<table>
<tr>
<td><div class="scrolldiv">.::content goes here::.</div></td>
</tr>
</table>

You can also place it outside the table and position it with CSS, but this is the easier way. You also have to change the width and height to your likings...

I hope I have made clear for you, if you still have any probs just ask it here. I'm sure anyone who can help, will help...

Stiker · 04-15-2004

Muy bien grasies. I cant thank you enough. Anyway back to coding weeeee

malboroman · 04-15-2004

Your welcome... I'm glad I finally got to help someone with some sort of coding. Not so long ago I knew just as much as you. I just read a lot while I was doing nothing...

Stiker · 04-19-2004

I cant seem to get teh scroll bar spaced away from my cells in the table. It seems to like to stick to them pretty snug. I ahev messed aroudn with a few things and am goign to continue looking for the answer but once again am lost.

Here is the code.

<td align="left" valign="top" style="padding-left: 50px; padding-top: 20px">
<table border="0" width="0" height="0" cellspacing="0" cellpadding="1">
<tr> <th>.:. Kansas Beta News .:.</th></tr>
<td align="left" valign="top" height="500" width="550" style="padding-top: 5px; padding-bottom: 5px"><div class="scrolldiv">
<table height="0" width="510" border="10">
<tr>
<td align="left" valign="top" height="100%" width="100%" style="padding: 30px">:: April 12, 2004 :: Welcome to the new Kansas Beta Website
<hr>
<table>
<tr>
<td style="padding-top: 10px">- This is the new layout for the Sig Ep Kansas Beta webiste brought to you by
Ra1nn3 and Su^-^a productions. Much of the content is still being submited and coded
and will be brought to you shortly. In the mean time please browse through each page
to get a feel for the life here and K-State Kansas Beta.</td>

</tr>
</table>
<hr>
</td>
</tr>
</table>
</div></td>
</table>
</td>

Also how do you put the code into one of those neat little code boxes?

thank you

malboroman · 04-19-2004

I don't know exactly what you mean... could you explain it with a SS or something?

Stiker · 04-19-2004

Here is what it looks like. ( did this in photoshop cus i coudl not copy the pic) The scroll bar is overlaping the board. I am using tables to make the boards and such not imported images.

Edit: I should probably try putting the code one more table above and maybe that will help so i will try that, but if come and see no reply with me fixing it pls help out if you know how to fix..thx

Stiker · 04-19-2004

yeah just tried that and it still overlaps the boarder. To think a miniscule code such as this became such a nightmare