Weird. I don't have a solution yet, but here's some more info.

1. It's only happening in Internet Explorer. Firefox and Opera don't have the scrolling problem.

2. If I reload the page over and over the problem comes and goes.

3. custom.css contains this:

body {
	background: #000 url(img/bg.png) repeat-y 50% 0;

I don't think you want the image anymore.

4. Internet Explorer seems to stop displaying as soon as it gets to the part where FF starts showing bg.png. Then the times when IE loads the whole page, the background image is not visible.

Try changing that line to background: #000; Even if it doesn't fix your IE problem, it will make your page look better in FF and Opera.

Cleaned out that along with some other bits of code that weren't so clean but still no luck.
personman wrote:

Weird. I don't have a solution yet, but here's some more info.

1. It's only happening in Internet Explorer. Firefox and Opera don't have the scrolling problem.

2. If I reload the page over and over the problem comes and goes.

3. custom.css contains this:

body {
	background: #000 url(img/bg.png) repeat-y 50% 0;

I don't think you want the image anymore.

4. Internet Explorer seems to stop displaying as soon as it gets to the part where FF starts showing bg.png. Then the times when IE loads the whole page, the background image is not visible.

Try changing that line to background: #000; Even if it doesn't fix your IE problem, it will make your page look better in FF and Opera.

Hmm. Have a look at the "bSideBar" selector in your CSS. It should be an ID selector [#], not CLASS selector [.] ;)

If done correctly, you shouldn't need an overflow on it.

I'd go with something like:

.bPosts {
float:left;
width:75%;
background: #000;
}
#bSideBar { 
width:25%;
float: right;
background: #000;
color: #fff;
}

I don't know if this will resolve your problem or not in IE, b/c IF you float your content left and your sidebar right, none of your content will actually be "wrapped" in the wrapper DIV. An "overflow:hidden" & "height:100%", might help there.

If not, you can always do this. UNFLOAT the bPosts content, then MOVE the sidebar up in your HTML, so that it's FIRST (after the header, but before the .bPosts DIV) ... then FLOAT right the sidebar. (That's basically how our pages are constructed. This geometry allows the body text to wrap under the sidebar, when it ends, using more of the page real estate). :D

Also, FWIW, most of your images contain about 5-10X more data than they need (350px X 233px pix can prolly be reduced to 25-50KB ... rather than the HUGE 250KB that most are now). Your page will load lots faster and people on dialup won't have to suffer through a MB xfer for every 4 images. ;)

Hope this helps.

stk wrote:

Hmm. Have a look at the "bSideBar" selector in your CSS. It should be an ID selector [#], not CLASS selector [.] ;)

If done correctly, you shouldn't need an overflow on it.

I'd go with something like:

.bPosts {
float:left;
width:75%;
background: #000;
}
#bSideBar { 
width:25%;
float: right;
background: #000;
color: #fff;
}

I don't know if this will resolve your problem or not in IE, b/c IF you float your content left and your sidebar right, none of your content will actually be "wrapped" in the wrapper DIV. An "overflow:hidden" & "height:100%", might help there.

If not, you can always do this. UNFLOAT the bPosts content, then MOVE the sidebar up in your HTML, so that it's FIRST (after the header, but before the .bPosts DIV) ... then FLOAT right the sidebar. (That's basically how our pages are constructed. This geometry allows the body text to wrap under the sidebar, when it ends, using more of the page real estate). :D

Also, FWIW, most of your images contain about 5-10X more data than they need (350px X 233px pix can prolly be reduced to 25-50KB ... rather than the HUGE 250KB that most are now). Your page will load lots faster and people on dialup won't have to suffer through a MB xfer for every 4 images. ;)

Hope this helps.

Thanks for all the great feedback, i'll give it a shot.

As to the image sizes, that's because I just pull links directly out of my photo album which uses fairly high rez shots. As for the photo album itself, all the resizing is automated via a Java app i wrote so they probably aren't optimized to the fullest extent. But I am prone to taking hundreds of pictures in a single day and there's no way I'm processing all those by hand.

stk wrote:

Hmm. Have a look at the "bSideBar" selector in your CSS. It should be an ID selector [#], not CLASS selector [.] ;)
..more tips...

Well, I tried your tips but unfortunately nothing seemed to work. Well, that's not true if I unfloat bPosts and move the html like you said it does always load the page correectly but its very ugly. All the diebar stuff ends up on top with the posts underneath. I'm sure this isn't what you intended but its how it turned out for me.

Dear WickedChicken,
the only way to solve the disappearing scrollbar problem is to delete the
Doc Type Definition in line 5 of your _main.php (within your prefered skin).
IE does not like XHTML and therefore behaves buggy.
I know, this is not the elegant way, but it helps. Don´t know of any other solution.

There is a small issue to be solved additionally: After removing your DTD, you also have to make your font sizes in your stylesheet one tick smaller each.

Kind regards from Austria
eliZZZa

IE does not like XHTML and therefore behaves buggy

Not that I'm an IE fan, but LOL. :lol: