Automatically fill index page and get rid of horizontal scroll?

[jmculver]

I want to disable the horizontal scroll on my index page. I still need the vertical scroll to show up, but only if there is more content to scroll.

I also want to make it so the graphics and contents of the page stay aligned and fill the window even if it is resized by the viewer.

What's the best way to do this?

thanks

[Excavator]

Hello jmculver,

I want to disable the horizontal scroll on my index page.

overflow-x: hidden;

I still need the vertical scroll to show up, but only if there is more content to scroll.

Your browser does that on it's own, you don't have to write anything to make it do it.

I also want to make it so the graphics and contents of the page stay aligned and fill the window even if it is resized by the viewer.

What's the best way to do this?

Both staying aligned and filling the page are pretty hard to do. Do you have the url of a page that does this?

[Apostropartheid]

Originally Posted by jmculver

I want to disable the horizontal scroll on my index page.

Don't do that. No, really, don't.
What if someone comes to your site with a small resolution/mobile browser? How will they be able to see anything? And you can't count on mobile medium stylesheets either, because some think they're above that. There are solutions, though: code for 800 or 1024 pixels (choose your personal preference) or have a fluid layout (that's percentages of available screen estate) and live and let live.
I'm guessing that IE is chucking a huge random margin on the right side of your page? IE really likes to do that...

[abduraooft]

I want to disable the horizontal scroll on my index page. I still need the vertical scroll to show up, but only if there is more content to scroll.

Could you post a link to your page to see what's causing that horizontal scroll?

[adurian]

I have a similar problem. I want to be able to have an image contained in a div that acts as the background image which is resizable, but have content contained in another div that makes the browser window scroll up/down. But it's that div container containing the scroll that is giving me problems, because it's unnecessarily putting horizontal scroll bars on the window. Here's the sample url:
http://www.issbc.org/adrian_test/default.htm

Can anybody give me any hints about what to do to avoid the horizontal scrolling? I would do the overflow-x:hidden trick, but, as mentioned above, I don't want to use it in case of viewers with tiny resolution.

Any help would be greatly appreciated! Thank you!

[abduraooft]

Just have a try by using the method described in http://webdesign.about.com/od/css3/f/blfaqbgsize.htm, which has no overflow:auto;

[jmc2009]

The frame page and images look fine when viewed on my Macbook Pro with Safari and Firefox.

But I went on my G5 Mac and on Safari and everything is too big for the browser. the images are too big and are cropped (because i have scroll turned off) and then the content has horizontal scroll which shouldnt be there.

(again, its fine on my macbook pro laptop, which i used to create the files)

the website isn't finished. but you can click here.

www.portfolio.jmculver.com

click on portfolio link and you'll see what I mean.

(i know there are some broken images and links, I'm still working on the content but want to make sure i have it fitting the browser)

If i resize everything, then it will be too small on my laptop browser, but fit in the G5 browser?

I want to make it where it isn't going to be too big or small in other people's browsers.

any help?