Advanced CSS problem

[Mathias(DK)]

Hi!

I have 'inherited' a website layout that has a few CSS problems I hope you can
help me with. I've tried all I can think of, but I still have the problem.

Here's the layout: [url]http://www.96ppi.net/ibooks/[/url]

This is the main (front) page. Looks fine in IE, but the boxes on the right
fails in Firefox. Thats one problem.

However, the bigger problem is that some content overlaps, making text
unreadable (looks ugly) as in this page:

[url]http://www.96ppi.net/ibooks/produkt.htm[/url]

The problem I have is that the CSS is written by some other guy, whom I dont
even know, and it's rather advanced (convoluted would be another word). And I
can't seem to solve these problems with Firefox (and IE7) displaying text on
top of eachother.

The HTML and CSS checks out reasonably in a validator...

CSS files:

[url]http://www.96ppi.net/ibooks/narrowcontent.css[/url] (probably where the fault lies)
[url]http://www.96ppi.net/ibooks/navigation.css[/url]
[url]http://www.96ppi.net/ibooks/pagelayout.css[/url]
[url]http://www.96ppi.net/ibooks/rightcolumn.css[/url]
[url]http://www.96ppi.net/ibooks/typography.css[/url]

ANY tips you can provide would be most welcome. Let me know if I can provide
further info.

Mathias

[rakeshpatil]

Hi Mathias,

As per my observation you need to add "display:table" this will work in FF and IE7 also

Class Name:
class=RightBoxMiddle

Add Style
style="display:table;"

Enjoy ! :)

[Mathias(DK)]

Hi Rakesh!

That seems to solve my problem with the boxes on the right. Excellent! I had
never heard of display:table before. THANKS!!

However, the most serious problem remains: the one about overlapping elements
in the middle of the page. I have tried everything I know and am desperate for
a solution. Do you have any idea whats wrong?