|
|||||||||
|
|||||||||
| |||||||||
|
|
|
| |||||||||
 |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
Dev Shed Forums Sponsor:
|
|
#1
September 23rd, 2003, 09:05 PM
|
||||
|
||||
|
HTML & CSS site sizing problem
Hi all,
I am fairly new to HTML and CSS in general, but I know the basics. Can you guys help? I am building a website for my family (nothing major) and one of the areas is for my son. I am building it now. It's here. Oh, you'll need a username and password to get in there: username: password: Sorry, I wanna keep out the riff-raff. You guys have been great for questions of mine in the past, and I trust the peeps on this site! Anyway, the first thing I was wondering is this: Is it possible to have the image resize through CSS to fit the area it's in? If not, that's ok, not a big deal. One thing that is really bugging me, though is this. In IE, the page does not fit on one screen, although I would like it to, and there's no reason why it shouldn't. In IE, it is scrollable downward. What's more strange is that in NS and Opera, it can't scroll down, but it can scroll left and right! Also, in NS, all 8 links are on the left, instead of 4 on each side. In Opera, the layout is fine (except for the scrolling), but there's no image! There's no image in NS, either! There are none of these problems in IE (except that the window can scroll down). I have attached my CSS file to let you all take a gander. Can you explain it? I'm sure it's pretty easy, but I just don't see it... Also, as you'll see, I am not doing anything "hardcore" in CSS. I think this is all pretty basic stuff, so why does it act so very differently between browsers? Is the CSS support really this bad in NS and Opera? It can't be! I have found a few things I can "set" in Opera and NS on how to handle CSS, but it didn't really make any differences. Can I get the image to fit and fill up the area it's in? How can I get this site to fit on one screen on almost ANY size monitor? How can I get this working uniformly on all browsers? That's really what I'd like to know! Thanks a million guys! I appreciate any help! Chris
__________________
Pop, pop, fizz, fizz, oh what a relief it is! Last edited by cjwsb : September 24th, 2003 at 07:15 PM.
|
|
#2
September 23rd, 2003, 10:05 PM
|
||||
|
||||
|
What version of IE are you testing in? IE 5.X has a broken box model, so if you tested it there, it's going to look different in the newest Opera and NS. Note that's IE that's messed up, not Opera/NS.
This is how a browser is suppose to handle things: http://www.w3.org/TR/CSS21/box.html This offers some workarounds to IE5's broken box model (as well as some other good reads) http://www.glish.com/css What I've noticed in your CSS is that you have an element with 100% width and 30px padding. This makes the element's total width 100%+60px (how it should be, but IE5 messed that up), which causes a horizontal scroll bar in the newest browsers. What you really want is something like this: Code:
#header
{
width: 90%;
padding: 5%;
}
__________________
# Jeremy Explain your problem instead of asking how to do what you decided was the solution.
|
|
#3
September 23rd, 2003, 10:15 PM
|
||||
|
||||
|
Using IE 6, NS 7.01, Opera 7.11. Weird, though, because IE 6 looks the best of all of 'em, and works with all the style sheets I have ever done so far, the other two haven't... IE is NOT my problem... Weird. I will try what you suggest and let you know. Thanks!
Chris
|
|
#4
September 23rd, 2003, 10:21 PM
|
||||
|
||||
|
Wait, I just did that... I realize, though, that it will only shorten the header. The header isn't the main problem, the overall height of the page is. That DID fix the left and right scrolling problem in NS and Opera, but it looks bad in IE now because the header is shortened width-wise... And they all 3 now want to scroll downwards! Ugh... Web design... Any other thoughts? Thanks!
Chris Last edited by cjwsb : September 24th, 2003 at 07:52 AM.
|
|
| Viewing: Dev Shed Forums > Web Design > CSS Help > HTML & CSS site sizing problem |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
 |
|
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
