Chrome and Firefox display:inline css issue

[lanaya.elliott]

Hi,

I have an issue that started with Firfox where my online calendar (http://www.BHSU.edu/events) would show up underneath a div and flow off the screen. My solution was to wrap a div around the table and give the div the following properties. A hack, I know but it fixed the issue in firefox. However, if you visit the same page in Chrome -- it just spreads out way to much. AHHHH!

I have identified the problem as my initial class of display: inline. However, when I remove that class, it breaks in firefox and of course fixes it in chrome.

I am at a loss, any ideas?
Thank you for the input.

.eventMonthdiv table {display: inline !important; }
.eventMonthdiv:after {content: "."; display: block; height: 0; clear: both; visibility: hidden; }
/* Hides from IE-mac \*/
* html .eventMonthdiv {height: 1%;}
/* End hide from IE-mac */

[therealanodyne]

Hello,
may be a bit late but I just found that unanswred question of yours since I have a similar problem with CHROME (or better it's descendant without google's spyware, IRON).
Since I found that FIREFOX rarely has got any bugs it is the Webkit-engines based browsers like IRON and SAFARI who cause problems, even OPERA sometimes and you can hardly find anything about it in the net, strange enough.
If your problem is not solved yet, give me some more information please, may be I've got a hint.
I have problems with display: inline; on CHROME and SAFARI trying to realize a simple CSS hover Tooltip with display-inline; and position: absolute.
FIREFOX, IE !! (wow), OPERA all good. (All newest versions on Windows except IE7 which I kept for better downhunting bugs and issues with MSIE .)

Cheers,
Anodyne