14 replies [Last post]
RichardAFCB
Offline
newbie
Last seen: 15 years 24 weeks ago
Joined: 2005-02-26
Posts: 6
Points: 0

Hi all,

Foolishly when making my page I previewed in IE all the way through. Now I'm being made to pay. It looks fine in IE but terrible in Firefox. Any ideas where I'm going wrong?

http://www.nowaysylent.co.uk/richmedia2/index4.html

Cheers,

Richard

Anonymous
Anonymous's picture
Guru

Firefox doesn't like it

Dunno...I didn't dig in very deep but I didn't see any float clearing happening anywhere. Smile

RichardAFCB
Offline
newbie
Last seen: 15 years 24 weeks ago
Joined: 2005-02-26
Posts: 6
Points: 0

Firefox doesn't like it

Never had a clue what float clearing was before you mentioned it, but solved a lot of the problems with it now! Just hope I've used it right :oops:

What about the other issues? Such as borders not displaying and cell padding being incorrect?

Cheers,

Richard

Anonymous
Anonymous's picture
Guru

Firefox doesn't like it

RichardAFCB wrote:
Such as borders not displaying and cell padding being incorrect?
I see you have border style and size declared but no border color for most. Declare a color and see if they show. Smile

Anonymous
Anonymous's picture
Guru

Firefox doesn't like it

You may also want to read this: http://www.csscreator.com/css-forum/ftopic6672.html

Smile

RichardAFCB
Offline
newbie
Last seen: 15 years 24 weeks ago
Joined: 2005-02-26
Posts: 6
Points: 0

Firefox doesn't like it

Hi Triumph,

Thanks for the link. I'll definitely put that into practice when everything's working!

The borders still aren't displaying though even though I've defined the color Sad Any more ideas?

http://www.nowaysylent.co.uk/richmedia2/style.css

Cheers,

Richard

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 31 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Firefox doesn't like it

Your using shorthand border properties, but they are getting confused somewhat.
With the shorthand 'border-left' etc, group the other values such as colour and style and your borders should work.

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

RichardAFCB
Offline
newbie
Last seen: 15 years 24 weeks ago
Joined: 2005-02-26
Posts: 6
Points: 0

Firefox doesn't like it

Cheers! That's fixed the borders problem and I've learnt a thing or two again. The problem with the margins and/or padding remains though Sad

Thanks,

Richard

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 3 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Firefox doesn't like it

Regardless of whether or not they help you with this particular site, you should follow these links and read:
http://css-discuss.incutio.com/?page=BoxModelHack
http://www.positioniseverything.net/explorer.html

In future, develop your site for Firefox and then hack it for IE and the rest.

Life's a b*tch and then you die!

Helen
Offline
Enthusiast
NYC
Last seen: 15 years 30 weeks ago
NYC
Timezone: GMT-6
Joined: 2005-01-16
Posts: 135
Points: 0

Firefox doesn't like it

Richard,

as of noon on Sunday, EST USA, it's lookin' smooooothilicious in Mac Firefox 1.0 @ 1920x1200 res, if that's any consolation. Laughing out loud

Only glitch in a border is here:

RichardAFCB
Offline
newbie
Last seen: 15 years 24 weeks ago
Joined: 2005-02-26
Posts: 6
Points: 0

Firefox doesn't like it

Hi Helen,

Cheers for that - I'll fix the border.

Thing is if you compare it with IE it looks totally different. The gap between the menu and content shouldn't be as large, and there should be spacing between the rollover images :S

Cheers,

Richard

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 3 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Firefox doesn't like it

RichardAFCB wrote:
Thing is if you compare it with IE it looks totally different.

...so did you follow the links I gave you?

Life's a b*tch and then you die!

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 5 years 43 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Firefox doesn't like it

Just a couple of suggestions: as the whole of your header above your navigation is images, why not simply split your header up into two divs - one containing the images that sits above the other containing the navigation. That way, both divs would stretch the full width of your content area and would help get around the missing border problem (as displayed in Helen's screenshot).
You might also want to consider using image replacement so that you actually get some text content into your header (helps with search engines).
Also, I don't really see why you've chosen to do simple text rollover links in Flash - you can achieve exactly the same effect using CSS.
Another thing that seems unnecessary is putting your footer inside 2 divs when 1 would seem to suffice.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

Helen
Offline
Enthusiast
NYC
Last seen: 15 years 30 weeks ago
NYC
Timezone: GMT-6
Joined: 2005-01-16
Posts: 135
Points: 0

Firefox doesn't like it

I agree re. using simpler CSS rollovers for the nav links. I like the font you've used for them (what is it?), so I can understand why you wanted graphics instead of plain-text. As you can see from my grab, the default settings of the Adblock plug-in most folks use with Firefox makes the js-rollover-rendering a little unstable within your flash header, too.

RichardAFCB
Offline
newbie
Last seen: 15 years 24 weeks ago
Joined: 2005-02-26
Posts: 6
Points: 0

Firefox doesn't like it

OK cheers guys, will switch them to CSS.

It's Kalos Sans font by the way.

Tyseen - good point about the footer. Can't remember for the life of me why I did that!

Roytheboy - I had a skim through those links. Definitely things to consider when designing in future. And like you said, I'll be doing all my previewing in Firefox from now on! Still can't fix the padding and margin issues with the present design though :?:

Cheers,

Richard