Styling in Firefox

[Jon]

Hello all.

I'm having some problem with CSS errors.

In IE, everything looks great, but in FF the footer is appearing in
the middle of the site.

The link which is causing the problems is below:

www dot nantwichonline dot com/Establishment.aspx?id=1

You can see that the orange links appear in the middle of the screen,
but should be at the bottom.

I've replaced the . with dot as I don't wish look like I'm trying to
drive taffic.

Can anyone please advise as I'm pulling my hair out!

Thanks,

Jon

[Rik Wasmus]

On Tue, 16 Oct 2007 16:27:42 +0200, Jon <Jo*******@gmail.comwrote:

Hello all.

I'm having some problem with CSS errors.

In IE, everything looks great, but in FF the footer is appearing in
the middle of the site.

The link which is causing the problems is below:

www dot nantwichonline dot com/Establishment.aspx?id=1

You can see that the orange links appear in the middle of the screen,
but should be at the bottom.

I've replaced the . with dot as I don't wish look like I'm trying to
drive taffic.

Can anyone please advise as I'm pulling my hair out!

Fix these first:
http://validator.w3.org/check?verbos....aspx%3Fid%3D1

The quick reason for different behaviour besides tagsoup btw: MSIE
incorrectly stretches the container to contain floats, Firefox doesn't.
--
Rik Wasmus

[Janusz 'Kali' Kaliszczak]

Jon pisze:

Hello all.

I'm having some problem with CSS errors.

In IE, everything looks great, but in FF the footer is appearing in
the middle of the site.

The link which is causing the problems is below:

www dot nantwichonline dot com/Establishment.aspx?id=1

You can see that the orange links appear in the middle of the screen,
but should be at the bottom.

I've replaced the . with dot as I don't wish look like I'm trying to
drive taffic.

Can anyone please advise as I'm pulling my hair out!

Thanks,

Jon

in:

..post {...} in style.css

get rid of: height:160px;

and add: overflow:hidden;
to force float clearing.

And read this:
http://www.positioniseverything.net/easyclearing.html
to read how floats behave
--
Janusz 'Kali' Kaliszczak
Hint: OdpisujÄ…c na priva zdebuguj adres

[Beauregard T. Shagnasty]

Jon wrote:

I'm having some problem with CSS errors.

Your CSS validates, but your (X)HTML has errors.

<http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.nantwichonlin e.com%2FEstablishment.aspx%3Fid%3D1>
"This page is not Valid XHTML 1.0 Strict!
Result: Failed validation, 29 Errors"

In IE, everything looks great, but in FF the footer is appearing in
the middle of the site. The link which is causing the problems is below:

www dot nantwichonline dot com/Establishment.aspx?id=1

You can see that the orange links appear in the middle of the screen,
but should be at the bottom.

First things first. Fix the errors and try again. Not all browsers
compensate for author mistakes in the same fashion.

Oh, and please fix the font size, so the majority of humans with average
eyesight can read it. font: 0.74em is only 3/4th of my default size.
http://k75s.home.att.net/fontsize.html

--
-bts
-Motorcycles defy gravity; cars just suck

[Jonathan N. Little]

Jon wrote:

Hello all.

I'm having some problem with CSS errors.

In IE, everything looks great, but in FF the footer is appearing in
the middle of the site.

Not is IE7, looks just like FF! (Looks a you "wish" in IE6), but your in
quirks mode so chances are it ain't going to happen. Need to fix your
makeup.

http://validator.w3.org/check?verbos....aspx%3Fid%3D1
[Invalid] Markup Validation of
http://www.nantwichonline.com/Establishment.aspx?id=1 - W3C Markup Validator

>
The link which is causing the problems is below:

www dot nantwichonline dot com/Establishment.aspx?id=1

You can see that the orange links appear in the middle of the screen,
but should be at the bottom.

I've replaced the . with dot as I don't wish look like I'm trying to
drive taffic.

No need we can see this is a legitimate question, no real need to munge
the address.

>
Can anyone please advise as I'm pulling my hair out!

Also markup is just....hmmm well not really very good. You create pseudo
heading with <band <br>'s where you should use <h#>, stuff like this:

<p><strong></strong></p>

Overly complicated nested <div>'s and <span>'s

Here is a bad start:

body {
padding: 0;
margin: 0;
font: 0.74em Arial, Helvetica, sans-serif;
^^^^
Don't start out with micro text...

and all your block are defined in pixels, guess what happens when you
enlarge the text?

So the point of my litany here is you could spend a tremendous amount of
time chasing the one(or more factors) that is causing the problem. I'd
say better to start a fresh, and do so more simply and with semantic
markup. Avoid quirks mode because once triggered inter-browser
inconsistency will be lost. Fix your errors. Do not design with IE6 and
then check with Firefox for problems but start the other way around.
--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

[Jon]

On 16 Oct, 16:54, "Jonathan N. Little" <[e-mail]:

Jon wrote:

Hello all.

I'm having some problem with CSS errors.

In IE, everything looks great, but in FF the footer is appearing in
the middle of the site.

Not is IE7, looks just like FF! (Looks a you "wish" in IE6), but your in
quirks mode so chances are it ain't going to happen. Need to fix your
makeup.

http://validator.w3.org/check?verbos...2Fwww.nantwich...
[Invalid] Markup Validation ofhttp://www.nantwichonline.com/Establishment.aspx?id=1- W3C Markup Validator

The link which is causing the problems is below:

www dot nantwichonline dot com/Establishment.aspx?id=1

You can see that the orange links appear in the middle of the screen,
but should be at the bottom.

I've replaced the . with dot as I don't wish look like I'm trying to
drive taffic.

No need we can see this is a legitimate question, no real need to munge
the address.

Can anyone please advise as I'm pulling my hair out!

Also markup is just....hmmm well not really very good. You create pseudo
heading with <band <br>'s where you should use <h#>, stuff like this:

<p><strong></strong></p>

Overly complicated nested <div>'s and <span>'s

Here is a bad start:

body {
padding: 0;
margin: 0;
font: 0.74em Arial, Helvetica, sans-serif;
^^^^
Don't start out with micro text...

and all your block are defined in pixels, guess what happens when you
enlarge the text?

So the point of my litany here is you could spend a tremendous amount of
time chasing the one(or more factors) that is causing the problem. I'd
say better to start a fresh, and do so more simply and with semantic
markup. Avoid quirks mode because once triggered inter-browser
inconsistency will be lost. Fix your errors. Do not design with IE6 and
then check with Firefox for problems but start the other way around.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIOhttp://www.LittleWorksStudio.com

Thank you to everyone who has help. We've fixed a number of issues and
are working though the rest.

All the best,

Jon