CSS Issue on Chrome/FF but works fine on IE

@lynsey93Aug 18.2010

Title says it all. I’m working on a calendar based on a tutorial online, and I have it working beautifully on IE but it doesn’t want to look right on Firefox or Chrome. Any suggestions? I haven’t done a lot with CSS so it’s probably just something simple.

~~[url]~~http://marchingrebels.org/Testing/Calendar2.php[/url]

Thank you!

to post a comment

CSS

@FangAug 18.2010 — #Your link does not work

@lynsey93authorAug 18.2010 — #Oh sorry, it's just Calendar not 2.

@KacheetoAug 18.2010 — #Your problem lies with the fact that table data doesn't/shouldn't support position:relative property within FF or Chrome...

Your only solution is inside all your <td>*calendar data*</td> tags add a <div style="position:relative;">*calendar data*</div> to wrap the data inside each table data.

So sample is:

[CODE]<td class="calendar-day"><div class="day-number">15</div><p> </p><p> </p></td>[/CODE]

make it:

[CODE]<td class="calendar-day"><div style="position:relative;"><div class="day-number">15</div><p>&nbsp;</p><p>&nbsp;</p></div></td>[/CODE]

Granted your styles break a little but this should get you on the right track.

@lynsey93authorAug 19.2010 — #Thank you, that fixed the numbers. There is still the problem that the days are smaller in chrome than in IE for some reason. It looks right in IE.

CSS Issue on Chrome/FF but works fine on IE

4 Comments(s) _↴

Also in #CSS _↴

Success!

Social

Version

CSS Issue on Chrome/FF but works fine on IE

4 Comments(s) ↴

Also in #CSS ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

4 Comments(s) _↴

Also in #CSS _↴