/    Sign up×
Community /Pin to ProfileBookmark

bizzare firefox error

Copy linkTweet thisAlerts:
Feb 15.2008

Hi,

I have a bit of a bizzare error with FF. when the page is very big in height it cuts the footer off. It does not do it in IE (strangly enough). There is ALOT of css code so at the moment im just wondering if there is anything obvious that would cause it.

The image shows my problem. See the size of the scroll bar as an idea of how big it is.

Thanks
k0r54

[upl-file uuid=0c9d051d-ea98-41d1-b23e-75b30509371e size=43kB]err.jpg[/upl-file]

to post a comment
CSS

15 Comments(s) ↴

Copy linkTweet thisAlerts:
@Frank62Feb 15.2008 — k0r54,

The only thing I can think of is quirks mode + max-height that is not great enough. That makes divs stretch in IE, but rigid in FF.
Copy linkTweet thisAlerts:
@k0r54authorFeb 15.2008 — any obvious work arounds?
Copy linkTweet thisAlerts:
@dtm32236Feb 15.2008 — do you have a correct [url=http://www.alistapart.com/articles/doctype/]doctype[/url]?

and to you have max-height applied to any elements (like the container)?
Copy linkTweet thisAlerts:
@Frank62Feb 15.2008 — any obvious work arounds?[/QUOTE]

Yep, increase the max-height... Just changing the mode from quirks to strict, something that is done by most doctypes, will only make IE cut off the footer, too. And you will have to rewrite parts of your code then, too, because IE will then start to behave very differently (the so-called box model rendering difference).
Copy linkTweet thisAlerts:
@k0r54authorFeb 15.2008 — no max-height and doctype is transitional

Thanks

k0r54
Copy linkTweet thisAlerts:
@k0r54authorFeb 15.2008 — Yep, increase the max-height... Just changing the mode from quirks to strict, something that is done by most doctypes, will only make IE cut off the footer, too. And you will have to rewrite parts of your code then, too, because IE will then start to behave very differently (the so-called box model rendering difference).[/QUOTE]

I set a max-height to 10000px, 5000px, 2000px and neither of them make a difference???

Thanks

k0r54
Copy linkTweet thisAlerts:
@Frank62Feb 15.2008 — Probably something else then, k0r.

But with Firebug, an analytical FF plug-in, it is quite easy to find errors that make FF act unwantedly. However, your site has to be online for that. Just repost your question then, I would advise.
Copy linkTweet thisAlerts:
@k0r54authorFeb 15.2008 — Hi,

where can I analytical FF. My website is running on my home web server. Is this enough? or does it actually need to be public facing?
Copy linkTweet thisAlerts:
@k0r54authorFeb 15.2008 — sorry daft question! got it
Copy linkTweet thisAlerts:
@k0r54authorFeb 15.2008 — Hi,

Ok I got firebug installed but how do I use it to diagnose my problems?

Thanks

k0r54
Copy linkTweet thisAlerts:
@Frank62Feb 16.2008 — OK.

  • 1. View the page that gives problems with FF.

  • 2. Keep an extinguisher at hand just to be sure.

  • 3. Press F12 to start Firebug.

  • 4. Do not smoke in its vincinity!

  • 5. Scroll your own page to its bottom.

  • 6. At Firebug's left upper corner, click Inspect.

  • 7. Locate the square where you think the footer should be by hoovering over that area with the mouse. In the left Firebug window you will see the HTML and in the right the CSS.


    • The rest you have to do yourself, i.e. you have to have a good knowledge of CSS. It only helps to locate the applicable HTML and CSS of a problematic area. But that can be a horrible task, especially in case of external style sheets. That's why we like it so much.

    You can also change the CSS in Firebug's right window. Just click what you want to change, and the rest will become clear automatically. Changes are rendered real-time. Don't be afraid of making mistakes, 'cause the Firebug editing is only a cache editing, not a real editing. And with F5 everything is restored to the original cache file.

    Good luck.
    Copy linkTweet thisAlerts:
    @k0r54authorFeb 16.2008 — Very nice!!!

    Job done. Stupid me but with all the css it ended up being i forgot to put the left float on the element above the footer!

    Cracking little program - be sure to have the extinguisher and the no smoking warnings up!

    Thanks loads Frank- hope this helps some1 else
    Copy linkTweet thisAlerts:
    @drhowarddrfineFeb 16.2008 — btw, max-height doesn't work in IE.
    Copy linkTweet thisAlerts:
    @Frank62Feb 16.2008 — btw, max-height doesn't work in IE.[/QUOTE]

    It does in standards mode, at least in IE7. That's why I said "Just changing the mode from quirks to strict, something that is done by most doctypes, will only make IE cut off the footer, too."
    Copy linkTweet thisAlerts:
    @dtm32236Feb 17.2008 — btw, max-height doesn't work in IE.[/quote]

    it will with a very simple fix:

    min-height:300px;

    height:auto !important;

    height:300px;
    ×

    Success!

    Help @k0r54 spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 5.20,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...