Search code examples
cssjquery-mobilefullcalendarthemeroller

jQuery Mobile and fullcalendar css conflict

I am new to Android and jQuery Mobile.

I am using fullcalendar in jQuery Mobile.

as you can see the event title is bold and blur, the fullcalendar header also not fits perfectly when test at Samsung Galaxy II. The original fullcalendar fonts is nice and sharp.

If I test remove this jQuery Mobile theme css it will work fine, I guess is jQuery Mobile css crash with fullcalendar css. Sorry, I have not much experience in css.

<link rel="stylesheet" href="http://dl.dropbox.com/u/41465102/android-theme.min.css" />

So, please guide me

  1. how to make event title font exactly like the original

  2. the full calendar header is fits perfectly in mobile

Solution

  • For fixing the event title font,remove the text shadow from it using the following css:

    .fc-event-title{
   text-shadow:none;
}

    Updated fiddle - http://jsfiddle.net/JaaQg/5/