Forum Moderators: mack

Message Too Old, No Replies

right side scrollbar of a div (overflow) tag not visible

right side scrollbar of a div (overflow) tag not visible

         

mavrick

12:17 pm on Jun 23, 2003 (gmt 0)

10+ Year Member



Hi

Having a problem with a client, when he gets on the site he can not view the right scrollbar. I have the entire site in div tags (for the css print) with the content in an overflow:auto style so the scrollbar appears for the content.

I have checked the client’s computer
He is running windows XP, explore version 6 and the screen resolution have been tried at both 800 by 600 and 1024 by 768 and still the scrollbar is not visible

This does not seem to happen on other computers.

Thanks

BlobFisk

12:45 pm on Jun 23, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi mavrick,

I've seen something similar to this before - although only in Netscape.

Try putting an empty paragraph after your last <div> (<p>&nbsp;</p>) and see if that fixes the solution...

mavrick

2:27 pm on Jun 24, 2003 (gmt 0)

10+ Year Member



this does not work any other suggestions

please

BlobFisk

2:38 pm on Jun 24, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Could you post the CSS for that layer and the <div> call from your html? That may help to identify an error.

Have you run you html and CSS through the W3C Validator [validator.w3.org]?

mavrick

8:35 am on Jun 25, 2003 (gmt 0)

10+ Year Member



hi

here is the code for my css

i have to css pages:

print.css

.topmenu {
visibility: hidden;
}
.Content {
position: absolute;
top: 80px;
left:0px;
padding:10px;
overflow:none;
}
.sidemenu {
visibility: hidden;
}

wkstyle.css

BODY {font-family: "Verdana,Arial"! important;
font-size: 9pt! important;
color: #000000! important;
font-weight: normal! important;
background-color: #ffffff! important;
BACKGROUND-REPEAT:no-repeat! important;
margin-top: 0px! important;
margin-bottom: 0px! important;
margin-left: 0px! important;
margin-right: 0px! important;
text-align: justify;}

A:link { color: #ffffff;
text-decoration: none;
font-size: 9pt! important;
}
A:visited { color: #ffffff;
text-decoration: none;
font-size: 9pt! important;}
A:active { color: blue;
text-decoration: none;
font-size: 9pt! important;
background-color="white"}
A:hover { color: blue;
text-decoration: none ;
font-size: 9pt! important;
background-color="white"
}

.b:link { color: blue;
text-decoration: none;
font-size: 9pt! important;
}
.b:visited { color: blue;
text-decoration: none;
font-size: 9pt! important;}
.b:active { color: navy;
text-decoration: none;
font-size: 9pt! important;
}
.b:hover { color:#cc3300;
text-decoration: none ;
font-size: 9pt! important;
}

.c:link { color: blue;
text-decoration: underline;
}
.c:visited { color: blue;
text-decoration: underline;
font-size: 9pt! important;}
.c:active { color: blue;
text-decoration: underline;
font-size: 9pt! important;
}
.c:hover { color:gray;
text-decoration: underline;
font-size: 10pt! important;
}

.d:link { color: navy;
text-decoration: underline ;
font-size: 9pt! important;
}
.d:visited { color: navy;
text-decoration: underline ;
font-size: 9pt! important;}
.d:active { color: black;
text-decoration: underline ;
font-size: 9pt! important;
}
.d:hover { color:#cc3300;
text-decoration: underline ;
font-size: 9pt! important;
}

.sidemenu {position:absolute;
left:0;
top:70;
visibility: display;
}

.topmenu {position:absolute;
left:178;
top:70;
visibility: display;
background-color:white;
}

.Content {position:relative;
left:70;
height:338;
width:600;
top:15;
overflow:auto;
scrollbar-arrow-color:navy
border-style:solid;
border-width:2px;
border-color:
black #E9E9E9 #E9E9E9 black;
padding:3;
}

i have pasted all the code in the page, sorry if it is a bit much.

here is how i call them

<link rel="stylesheet" media="print" href="/print.css" type="text/css">
<link rel="stylesheet" media="screen" href="/wkstyle.css" type="text/css">

another thing to note is that i, in my body tag made scroll="no" so i came make use of the overflow.

is there a setting on the uses computer that will need to be changed? , maybe.

this is funny, because the web site works fine on other sites.

thanks for the help

BlobFisk

10:17 am on Jun 25, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Wow! Lot's of code. There are a few errors I feel it's important to point out first (they may be the cause of the problem):


BODY {font-family: "Verdana,Arial"! important;
font-size: 9pt! important;

Try to avoid using all capitals. There is no need for the inverted commans (") around your Verdana, Arial. Also, it's worth putting in sans-serif after them to cater for users that have neither Verdana or Arial (rare, I know!). the! should be right in front of the important: !important. Points are a print unit, try using pixels, em's or %'s instead.

The correct ordering for anchor pseudo classes is:

Link - Visited - Hover - Active

This will maintain the correct colour throught the cascade.


.sidemenu {position:absolute;
left:0;
top:70;

Don't forget to specify units! I believe that it is not necessary for 0 values, but for anything else you should include them.


.d:hover { color:#cc3300;

You can truncate you hex value to #c30; It's shorthand and can clear up your CSS somewhat.


visibility: display;

visibility can be set to visible, hidden, collapse and inherit.

I wonder if correcting these will clear up your problem? It's always useful to feed your CSS into the W3C CSS Validator to flag any errors it may have.

mavrick

9:52 am on Jun 30, 2003 (gmt 0)

10+ Year Member



hi

have not got the site to work yet.

found out something, i had asked the client to access the site on another computer on his network and the same thing happened.

maybe it is the way their server is set up. i know this is not a place to discuss the server problems, but if u guys know any setting on a server that does not all a webpage to view css please inform me.

server: NT (not sure on version)

thanks a lot