View Full Version : StyleSheet Help - Scrollbars & Cursor


pwtgirl
05-05-2005, 10:14 PM
After reading everything I can find and all links provided for scrollbars it still isn't working correctly. Some how I ended up placing two BODY sections in my stylesheet, not sure how I did that but I did.. Below in green is the active stylesheet I'm using on my site. Shown in green.

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

P {
FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #4d3b27; FONT-FAMILY: verdana
}
A:link {
COLOR: #000000; FONT-FAMILY: verdana; TEXT-DECORATION: none
}
A:active {
COLOR: #000000; FONT-FAMILY: verdana; TEXT-DECORATION: none
}
A:visited {
COLOR: #6c6a28; FONT-FAMILY: verdana; TEXT-DECORATION: line-through
}
A {
CURSOR: crosshair
}
A:hover {
COLOR: #000000; TEXT-DECORATION: underline overline
}
BODY {
FONT-SIZE: 10px; COLOR: #4d3b27; FONT-FAMILY: verdana;
SCROLLBAR-FACE-COLOR: #d4c2aa; SCROLLBAR-HIGHLIGHT-COLOR: #d4c2aa; SCROLLBAR-SHADOW-COLOR: #000000; SCROLLBAR-3DLIGHT-COLOR: #d4c2aa; SCROLLBAR-ARROW-COLOR: #000000; SCROLLBAR-TRACK-COLOR: #d4c2aa; SCROLLBAR-DARKSHADOW-COLOR: #000000;
}
BODY {
BACKGROUND-COLOR: #0e1822;
margin: 0px;
left: 0px;
}
#contents-iframe {
position:absolute;
top: 52px;
left: 378px;
width: 374px;
border-width:2px;
border-color: #000000;
border-left-style:solid;
}
#content {
position:absolute;
left: 50%;
top: 50%;
width: 758px;
height: 487px;
margin-top: -243px; /* half of the height */
margin-left: -379px;
padding-top:50px;
padding-bottom:50px;
}


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

Below in purple I've tried to restructure the stylesheet making it into chunks that I can better navigate through. Also I removed the two BODY sections and made just one. Now it's a bit more understandable and not such a mess but still no change in the scrollbars.

P { FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #4d3b27; FONT-FAMILY: verdana}

A:link { COLOR: #000000; FONT-FAMILY: verdana; TEXT-DECORATION: none}
A:active { COLOR: #000000; FONT-FAMILY: verdana; TEXT-DECORATION: none}
A:visited { COLOR: #6c6a28; FONT-FAMILY: verdana; TEXT-DECORATION: line-through}
A { CURSOR: crosshair}
A:hover { COLOR: #000000; TEXT-DECORATION: underline overline}


BODY { FONT-SIZE: 10px;
COLOR: #4d3b27;
FONT-FAMILY: verdana;
SCROLLBAR-FACE-COLOR: #d4c2aa;
SCROLLBAR-HIGHLIGHT-COLOR: #d4c2aa;
SCROLLBAR-SHADOW-COLOR: #000000;
SCROLLBAR-3DLIGHT-COLOR: #d4c2aa;
SCROLLBAR-ARROW-COLOR: #000000;
SCROLLBAR-TRACK-COLOR: #d4c2aa;
SCROLLBAR-DARKSHADOW-COLOR: #000000;
BACKGROUND-COLOR: #0e1822;
CURSOR: crosshair;
margin: 0px;
left: 0px;}

#contents-iframe {
position:absolute;
top: 52px;
left: 378px;
width: 374px;
border-width:2px;
border-color: #000000;
border-left-style:solid;}

#content {
position:absolute;
left: 50%;
top: 50%;
width: 758px;
height: 487px;
margin-top: -243px;
margin-left: -379px;
padding-top:50px;
padding-bottom:50px; }

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

Another problem I can't quite get to work is the Cursor value. If I add in cursor:crosshair; any place other than in the Body section it not only doesn't make the change to crosshair but some how it changes the blue #0e1822 background color to white. I've place the cursor attribute under the links attributes and before the Body section. I've done this in the example below in red. Still wouldn't work.

P { FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #4d3b27; FONT-FAMILY: verdana}

A:link { COLOR: #000000; FONT-FAMILY: verdana; TEXT-DECORATION: none}
A:active { COLOR: #000000; FONT-FAMILY: verdana; TEXT-DECORATION: none}
A:visited { COLOR: #6c6a28; FONT-FAMILY: verdana; TEXT-DECORATION: line-through}
A { CURSOR: crosshair}
A:hover { COLOR: #000000; TEXT-DECORATION: underline overline}

CURSOR: crosshair;


It's a total mystery to me how this addition of the cursor change changes my background color.

I was able to get the cursor to change if I add the cursor:crosshair; to my Body section. But it doesn't change it on the whole page just the section of my div layer holding my layout image.

If anyone is still with me and not totally confused also could you lend a hand and help me out of my insanity pretty please.. LoL

BTW incase you need it the site can be found here (http://www.mentalcruelty.org) . Hope this isn't considered adding just thought you might need it for reference to my questions.

Hugglez -- Mindy

lefty
05-06-2005, 12:07 AM
Where do you want the cursor? Do you want it just over links, or all the time? if you put it under the body section it'll be a crosshair all the time, but if you put in into one of the link attributes it'll do it only over links.

kittycat
05-06-2005, 02:10 AM
For the scrollbar, try removing this from the top of your HTML pages
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

pwtgirl
05-06-2005, 03:16 AM
For the scrollbar, try removing this from the top of your HTML pages
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Thank you so much!!

I've been staring straight at that lil bit of muck for days now and never even paid enough attention to read it or see what it was.. Something dreamweaver auto stuck on the pages. It's fixed!!

Hugglez