mark | r said:
www.nemark.neue.co.uk
anyone help me debug this? it looks fine in ie but damned nasty in mozilla
(xhtml 1 strict)
It looks pretty ordinary in IE as well:
http://users.bigpond.net.au/rf/test/neue.jpg
A quick look at your CSS reveals two things:
It is far too complex.
You are trying way too hard to defeat the browsers build in layout engine.
It really looks like you have been given a design on a peice of paper and
are trying to reproduce it exactly in a non-paper medium.
Take for instance the div that your first lot of services live in. You give
this a predefined background (like every other div on the page).
http://www.nemark.neue.co.uk/images/servicesbg.gif
As soon as anything changes, like font size or the exact way the browser
likes to lay things out or even the DPI setting of the viewers computer
(something over which you have no control) then this design will break
I suspect you hand crafted this page for IE. I would not expect it to work
on any other browser. On the other hand, if you had hand crafted the page
using Mozilla then it would work in Mozilla but then I would not expect it
to work in IE, or any other non-gecko based browser.
Suggestons:
Simplify the CSS dramatically.
Don't use background images. To achieve those boxes, use CSS borders on the
divs. That way if the layout changes then the borders will change as well.
Never rely on content fitting exactly into a background image, it wont.
You *can* use a non-repeating background for that arrow in a circle thing
but why bother, just plonk the image in with the content.
You also seem to be using background images just to colour things in:
http://www.nemark.neue.co.uk/images/topnavbg.gif
or worse,
http://www.nemark.neue.co.uk/images/topnavdiv.gif
Don't do this. use background-color: Every time you specify an image in your
CSS there is another round trip back to the server to get the image (the
first time anyway). This really slows down the loading of your page.
Cheers
Richard.