4 replies [Last post]
shawnlindsay
Offline
newbie
Last seen: 16 years 34 weeks ago
Joined: 2003-12-17
Posts: 6
Points: 0

When I narrow the browser window to 520px a horizontal scrollbar appears. When I narrow to 516, the banner no longer covers the top.

The page is at http://www.blogforcarol.us.

The style sheet is at http://www.blogforcarol.us/bfc.css.

Here are some chunks that might be relevant:

body {
margin:0px;
background-color:#1f1f5f;
}

#banner {
padding:2px 4%;
font-family:sans;
color:#fcfcfc;
background:#bf2f2f;
}

#left {
float:left;
width:63%;
background-color:#fcfcfc;
padding:4%;
font-family:times, serif;
color:#08082f;
}

#right {
width: 21%;
color: #fcfcfc;
background-color: #1f1f5f;
padding: 4%;
float:right;
}

I've tried all kinds of ways of messing with #banner, but still won't cover the screen below 516px.

Suggestions?

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 4 years 28 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

My site resizes improperly

Which browser / OS? Can't recreate in IE6, WinXPHome...

However having skimmed over it... if your widths+margins+padding+borders etc add up to 100% or close, and you've got the odd one declared as pixels, it might cause a problem. General workaround is to sum to slightly less than 100%, to be safe.

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.

shawnlindsay
Offline
newbie
Last seen: 16 years 34 weeks ago
Joined: 2003-12-17
Posts: 6
Points: 0

mozilla, firebird

yeah, that's funny, doesn't do it in Konq. I'm downloading Opera now ...

Oh my gosh, that looks horrible!

The text in the right side is shifted way to the right. It's Opera 7.23. Ouch. I can't have that. The scroll bar also kicks in, but that may have something to do with the add banner in Opera.

shawnlindsay
Offline
newbie
Last seen: 16 years 34 weeks ago
Joined: 2003-12-17
Posts: 6
Points: 0

One clue

If I change my defualt text size, the point at which the scrollbar appears changes. So I believe it has to do with the letter-spacing. Unfortunately, I haven't been able to get mozilla to recognize {letter-spacing: x%;}, or {letter-spacing:larger; (or longer, or bigger)}.

Wonder if I could use position:absolute on any of these elements to at least fix the banner. {width:100%;} did not help.

As for Opera, I just want to cry. I think something's not being inhereted, or the value that's used to compute percentages must be different.

shawnlindsay
Offline
newbie
Last seen: 16 years 34 weeks ago
Joined: 2003-12-17
Posts: 6
Points: 0

My site resizes improperly

I made some changes to accomodate Opera. ul was the main culprit: Opera has a default margin, whereas Mozilla has default padding, or something like that. To fix it I specified both margin and padding for ul.

I'm still seeing the scrollbars and incomplete banner when I narrow the screen.

Also, there's a problem with msie 6.0 in non-compliant mode I believe, esp. at small screen resolutions (600*800) with largish fonts. Something about the blockquote on the right not being centered or big enough. It should be 80% of the div.