Suppose you have a very basic web page (no frame at all) with just one graphic (not the background image) that is bigger than 800x600.

Of course, at 800x600 or lower resolution, scrollbars will appear.

Is there a way to allow only the vertical scrollbar to appear ? I know that i won't be able to see the graphic completely horizontally in that manner but it's only an example to simplify my question.

Thanks.

You may be able to do this with the overflow css property.

http://www.w3schools.com/css/pr_pos_overflow.asp

Thanks but this doesn't solves my problem. I want to keep the vertical scrollbar but not the horizontal.

correct me if im wrong, but that picture doesnt need to be 800x600 does it? i'd say about 99.9% of people that matter that have computers use a res of at least 640x480 (a pick of 600x400 would probably fit in their browser fairly well), so if you changed the res of your pic to that much, then it wouldnt be a problem at all. (or cut the side part off since its not a big deal as you said and make it 600x600)

second solution. are you actually just showing a pic or you want some other stuff? if you are just showing a pic, you could make a link straight to the picture like,

http://www.your-webserver.com/images/pic25.jpg

im not sure if that would work, but its an idea

FBI_Agent

Ok, look, i have a web page that is much more complicated than that, with iframes, css and everything, so i guess i'm an experienced user.

I just use the example of a simple web page with one big picture inside just to ask ONLY what i was interested in and not to confuse anyone.

It's just that i can't find anywhere on the web that winning script that could allow to have only a vertical scrollbar even if i do need an horizontal one.

I want this scrollbar thing to apply on my main page only NOT my iframe or other frames inside my main page.

Thanks.

b0red was actually on the right track...The overflow property is shorthand for the overflow-x and overflow-y properties. You can set them individually just like you set the overflow property (auto, scroll, hidden, inherit etc.)

I don't know which browsers support them...You can test that yourself. It seems to be part of the CSS2 standard though. I know for sure IE6 supports it.

-SN

hmm. ok thanks SN, i'll do some more research about these overflow properties and their syntax.

Zenno.

Zenno-
My guess is that you're trying to do this to an i-frame? If so, you should put something like
<STYLE>
HTML { overflow-x: hidden; overflow-y: auto;}
</STYLE>

in the page that is being framed, not the one that contains the iframe.

Search for overflow-x on msdn.microsoft.com and you'll get some more info on how IE6 handles it.

-SN

Nope ! Sorry, as i mentionned in my second post above, this is for my main page and not for any of my iframes.

Sorry SN.

p.s. I already knew about that method for iframe.

Zenno

Ok guys, this doesn't work.

here's the code i'm using, can someone tell me what's wrong:

html {
overflow-x:hidden;
overflow-y:auto;
}

And finally, here is the web page:
http://www.familleboutet.com/familleboutet.com/

Watch it in 800x600.

I know that my graphic is 780 pixels wide which is allright but there is extra space making the horizontal scrollbar appear that is caused by the fact that my graphic is presented in a table and that this table has a few extra empty cells at the right necessary to make the whole thing holding up together correctly.

So as you can see, the problem is on my main page, and my main page is not an iframe so i cannot use this script:

html {
overflow-x:hidden;
overflow-y:auto;
}

It just doesn't work.

Can somebody help me with this ?

Thanks

Zenno.

Zenno-
This one is my fault. I misread MSDN's documentation. I thought that it was saying that overflow applied to the HTML object (which I thought was strange) but really it was just referring to the CSS as HTML...

Anyhow, it should be BODY {overflow-x: hidden; overflow-y: auto;} rather than HTML. I tested it with an 830x200 image, and it worked in IE6, but not in NS 7.1. It seems to be a part of CSS3, so it will hopefully be fully supported soon.

Sorry for the error.

-SN

Hmm... i just tried it.

Since i'm not home right now, the only browser i've got to test the "body instead of html" you mentionned is IE 5.5 and it does not work.

I'll keep you posted.

Thanks a lot.

Ok, it doesn't work, and i tested it on IE 6.0.2800

Here's the link again so you can see by yourself:

http://www.familleboutet.com/familleboutet.com/

Thanks.

Zenno

Zenno-
This time it's not my fault :-) You left overflow: auto in the body CSS, which is overriding the overflow-x and overflow-y properties declared earlier. Take out overflow: auto and it works.

-SN

Yes !!

It's working perfectly now.

Thanks again. You've been a great help.

Zenno.