Scrollbars

[Jick]

Can someone go here (http://kd7pyo.infinitypages.com/) and click on the "Portfolio" link and look at how it's adding the bottom scrollbar and then tell me how to fix it? I have this is my external CSS file:

body { overflow-x: hidden }

But for some reason it's adding the bottom scrollbar to this page? I think it's possible it could have something to do with my source too so someone can look there too! How do I fix it so it dosn't have that bottom scrollbar? Thanks. :D

[toicontien]

I viewed your site in IE 5/Mac OS 9 and I don't see the scroll bars. What browser and what OS are you using to view your site?

It just may be some browsers' buggy support for the CSS property you described in the post above.

You may want to try:

overflow: auto;

instead of overflow-x. I know for a fact that IE for Windows and Mac will only put in scroll bars if there is enough content. Mozilla-based browsers (Moz 1.0 and NS 6.x and 7.x) will throw in the scroll bars anyway. Opera 6 and 7 behaves like IE.

You may also be seeing this as a "bug" when in fact it is a result of the browser working in quirks mode. Your pages do not have complete doctype tags at the beginning, which forces newer browsers out of standards compliance mode and into quirks mode. Browsers can sometimes behave in a dramatically different fashion from the standards set up by the W3C.

Try getting your pages to validate as HTM 4.01 Transitional and make sure your CSS validates as CSS 1 or CSS 2 before you go chasing browser bugs.

[Jick]

I'm validating my external CSS file through W3C and I got it all down to just these last errors but, I can't figure out what a "Generic Font" is? Here are all the last errors I'm getting:

Line : 25 font-family: You are encouraged to offer a generic family as a last alternative
Line : 31 font-family: You are encouraged to offer a generic family as a last alternative
Line : 37 font-family: You are encouraged to offer a generic family as a last alternative
Line : 44 font-family: You are encouraged to offer a generic family as a last alternative
Line : 52 font-family: You are encouraged to offer a generic family as a last alternative
Line : 58 font-family: You are encouraged to offer a generic family as a last alternative
Line : 65 font-family: You are encouraged to offer a generic family as a last alternative
Line : 71 font-family: You are encouraged to offer a generic family as a last alternative

Can anybody tell me how to fix these errors? Thanks. :D

[pyro]

You should always specify a generic font when you specify font-family. On the site I am currently working on, which uses the verdana font, I use this:

font-family: verdana, arial, sans-serif

sans-serif is the generic font. The reason this is needed is because not everyone has the same fonts installed on their computer...

[pyro]

Also, if you are going to put the Valid HTML 4.01 Transitional logo on your site, be sure it actually is valid:

http://validator.w3.org/check?uri=http%3A%2F%2Fkd7pyo.infinitypages.com

[Jick]

Pyro,
Yeah I know about that. A while back it was valid but now I did some updates and I need to fix it all again. Thanks.

I fixed all my CSS and now it's all valid but it's still adding the bottom scrollbar for some reson? I'm viewing the page with:

------------------------
Windows 98 SE
Internet Explorer 6.0
1024 x 768
------------------------

Does any body know how I can fix this problem?

[PeOfEo]

Is pyro hosting you or just letting you use his domain?

[pyro]

He's coasting along on a freebe account... for now :D

[PeOfEo]

hahaha, I just found out that my cable provider comcast gives me free web space :) I just found a new spot to shove all of my downloads so they dont clutter my working accounts!!! :)

[Jick]

I don't think any of those replys answered my question? Does anybody know how to fix my scrollbar problem? Thanks. :D

[Jick]

I just noticed that this scrollbar problem only seems to affect my pages which require them for example my "About Us" page dosn't need scrollbars because it's short and every thing looks fine on that page but pages like "Portfolio" and "Prices" that do require scrollbars since they are long do have the scrollbar problem. What could be wrong? I still want to allow the right hand side scrollbar so the user can scroll up and down but I just DON'T want to allow the bottom scrollbar which would allow them to scroll left and right. The overflow:x thingy dosn't work. What can I do here?

[pyro]

The problem is caused by this part of your CSS (in the body { } part) MARGIN: 35px; removing that makes the page work correctly. Note that it already worked correctly in Mozilla...

[Jick]

Ok, I removed the margin like you said and it fixed some pages but still for pages that are long it puts the bottom scrollbar? How should I fix this?

[Jick]

Did you guys forget about me? I really need help with this. Please someone tell me how to make it so the bottom scrollbar dosn't show up like it is right now. :(

[toicontien]

I've been chewing on this problem for a while. I was working on www.cm-life.com using a css layout. Some work required that a table of info be encased in a DIV with its overflow property set to auto.

If info crossed either the horizontal or vertical bounds, both horizontal and vertical scroll bars appeared, even if one of the scroll bars wasn't needed.

It seems to be an intrinsic behavior when dealing with the overflow property.

So basically what I'm saying is that there's nothing you can do about it. It's just how browsers work right now.

I visited your site in Moz 1/PC and IE 6/Win XP, and Moz didn't have horizontal scroll bars while IE did. You have to remember that IE has pretty lackluster support for CSS compared to Mozilla and Opera.

It also might be that the vertical scroll bars take up some width and the table cell is not resizing the width allotted to the content of the cell, and thus the content plus the vertical scroll bars take up more width than is allotted to the table cell.