The way the “pop up” for event details are displayed is the Google Calendar default and not an issue with the plugin. Google sets the width of the “bubble” overlay div to 400px so your calendar at 300px wide obviously doesn’t have the space needed. The rest of the bubble is “clipped”, including the “X” to close the overlay.
You can, however, add this to the gcalendar-wrapper.php file, just above the /* Tabs */
line :
div.bubble {width: 80% !important;}
This will allow your popups/bubbles to display in their entirety. I may go ahead and add this in future releases b/c it seems like a good idea.
The other issue is a bug with the Google Calendar and Google is working on it. This forum posts explains that.
Awesome, thanks so much! I actually went as high as 95% and it works. Thanks for the quick support.
I have a slightly different issue, along the lines of sizing the popup bubble. When I have an event description included for an event, the popup bubble is too long, and the bottom section which includes the desription is cut off. I think a possible solution is to have the popup bubble be a real popup that is overlayed, over the rest of the web site. So the size issues becomes a non-issue, and the bubble is closed after the viewer finishes reading about the event. AS it is, viewers are unable to read event descriptions.
@jmdziba – Can you post a link to an example page where this is happening? I don’t think I will be able to accommodate your proposed solution as this has more to do with the functionality of Google’s calendar than the CSS styling, which is all the Stout Google Calendar plugin modifies. Since the calendar is being display via an iframe, I’m not aware of a CSS solution for displaying the bubble above and outside the iframe that the calendar is contained within.