What is wrong with firefox ? Or is it just me ^^

[dalecooper]

Hi all, I have made this website and it seems to work in Safari, but not in Firefox. The iframe is not the right height in the later… I admit that I have tried different settings and sticked with what seemed to work in Safari.

Also, as I’m new to css, can someone take a quick look to tell me roughly what I have right and what I have wrong in the way I handled the whole thing. Please, it would really help me for my future work ^^

EDIT: btw, I used boilerplate’s css to reset the default, so you’ve got to scroll a bit to find the main rules, and again a little bit more to the media queries to find more.

[Mottie]

The issue is that the iframe height is set at 75%, but 75% of what? The html and body don’t contain elements that fill 100% browser height so the page stops about 275px down. If you look at the body height, it shows as zero. So you have two, maybe more, options:

1. Set the html, body & #container to 100% height, then set the article height to 75% to match the iframe size.
2. Set the iframe height to a pixel height instead of 75%.

[dalecooper]

Ok, thanks, it worked as expected. I need to keep in mind that a lot of functions depend on their parents^^

BTW, if I had put a height in pixel for the iframe (or any element), how would it behave on different resolutions ? Would it scale ? If not, how could I put a size in px and have it scale to the current resolution (except with media queries) ?

[Mottie]

Yeah, pixel heights won’t scale, but in the media queries itself you can define the pixel height of the iframe for each size. Otherwise you’ll need to use percentage heights.

[dalecooper]

ok, thank you.

[Author]

Posts