0

Can anyone figure this out? take a look at what I mean here:

https://www.wellchild.org.uk/

Compare it between any other browser & FireFox

Screenshot:

enter image description here

Have tested this on windows & mac in IE, Chrome, Safari, Opera & FireFox.. and its on FireFox im getting this problem!

Ive tried inspecting the page with the dev tools available in firefox and cant figure it out

Just a student
  • 10,560
  • 2
  • 41
  • 69
TheOne
  • 81
  • 1
  • 3
  • 18
  • Would you add relevant code to the question? – Pavlo Feb 06 '14 at 12:44
  • I think this is the same problem and it looks like a bug: http://stackoverflow.com/questions/13070630/firefox-body-margin-bug – Tom Spee Feb 06 '14 at 12:47
  • @Pavlo, there is a link to the code in the question – David Randall Feb 06 '14 at 12:50
  • [Something in my web site or project doesn't work. Can I just paste a link to it?](http://meta.stackexchange.com/questions/125997/something-in-my-web-site-or-project-doesnt-work-can-i-just-paste-a-link-to-it) – Pavlo Feb 06 '14 at 12:52

2 Answers2

3

Try one of the following:

1) remove float: left; from .mainHead nav ul li (style.css ... line 78) That should fix the problem cross-browsers. You may have to define left/right margin.

2)add the following code to style.css which will target only firefox browser:

@-moz-document url-prefix() {
    .mainHead nav ul li{
    float:none;
   }
}

Let me know what works for you...

CodeMonk
  • 920
  • 1
  • 12
  • 22
  • Sadly this didnt work for me, though I found that Piro's answer did however fix my issue. Thanks! – TheOne Feb 06 '14 at 15:31
1

I'm not sure, but it might be linked to this Firefox Bug : https://bugzilla.mozilla.org/show_bug.cgi?id=451791

In your case, this simple css workaround seems to get your page fixed on FF (haven't testedif it breaks other navigators)

.container { padding: 0.001em; }
PiroXXI
  • 47
  • 1
  • 7