the event day view does not wrap the text. (not sure if anyone else has fixed this, but i noticed someone else had same problem. http://drupal.org/node/25038)

this is due to the prescence of the form-item class, which in the drupal.css has the attirbute: white-space:nowrap;

therefore, by adding this below at the end of the event.css stylesheet, this solves the problem. i've nested the classes, so it should only affect the event module.

.event div.form-item {
white-space: normal !important;
}

CommentFileSizeAuthor
#16 event.css_2.patch1.29 KBdarren oh
#8 event.css_1.patch925 bytesdarren oh
#5 EventCSS.patch206 bytesskor

Comments

heather’s picture

heather commented
Title: event day view doesn't wrap » event day view doesn't wrap (here's code for fiixing!)
Component: Code » User interface

not sure if anyone is minding this, but unless the CSS is edited, others will continue to have this trouble
...

http://drupal.org/node/25038

SumDog’s picture

SumDog commented

I added the CSS tag listed above and it works fine on my site now. I hope this is included in the next release.

Thanks!

skor’s picture

skor commented
Version: 4.6.x-1.x-dev » 4.7.x-1.x-dev
Status: Active » Needs review

Still hapening with 4.7RC3 and latest Event module.

killes@www.drop.org’s picture

killes@www.drop.org commented
Status: Needs review » Active

not a patch

skor’s picture

skor commented
Status: Active » Needs review
StatusFileSize
new EventCSS.patch206 bytes

Fair enough.

jkirkwood’s picture

jkirkwood commented

Hi, I think quite a few people also have a problem with the Events calendar 'month' view where the main table encroaches on sidebars or disappears off the right-hand side of the page (with no horizontal scrollbar to scroll with), particularly when the theme uses tables. This also affects the event 'day' view that displays when you click on the sidebar calendar.

This fixes it for IE and does not mess up FF too much (from http://drupal.org/node/15107#comment-27209)...

.event-calendar table {
  width: 97%;
}

Thought it was worth mentioning it here if a patch is going in, as it is a bit of a spoiler 'out-of-the-box'.
(Sorry I'm not up to submitting patches myself yet - this is my first install).

jkirkwood’s picture

jkirkwood commented

Also (to get all the Event calendar width and format issues in one place), several people don't like the fact that the month view has flexible columns (which is probably that way as it covers up some of the problems caused by the white-space issue?). One suggestion (from DriesK at http://www.drupal.org/node/59662#comment-113152) is to add to event.css:

.event-calendar td {
    ...
    width: 14%;  /* 14% is about 1/7 of total table width */
}

which will work even better when the white-space fix is in...

darren oh’s picture

darren oh
Primary language English
Location Lakeland, Florida
commented
Title: event day view doesn't wrap (here's code for fiixing!) » event day view doesn't wrap (here's code for fixing!)
Status: Needs review » Reviewed & tested by the community
StatusFileSize
new event.css_1.patch925 bytes

I have created a combined patch for all this issues mentioned.

darren oh’s picture

darren oh
Primary language English
Location Lakeland, Florida
commented

Marked issue 74844 as a duplicate of this issue.

darren oh’s picture

darren oh
Primary language English
Location Lakeland, Florida
commented
Title: event day view doesn't wrap (here's code for fixing!) » Patch for Wrapping Text in Calendar
RayZ’s picture

RayZ commented

+1 RTBC

killes@www.drop.org’s picture

killes@www.drop.org commented

again: I don't understand much about CSS, I'd like to have a second opinion of somebody who does.

skor’s picture

skor commented

Sorry, but I can't claim to understand much CSS either. I've only started learning about it. In fact I can't even explain why my patch fixes the text wrap issue. I just took the fix posted by heather at the link provided and rolled the patch.

I've only experienced the original day-view not wrapping problem, so I can at least verify that the Darren OH's patch does fix that and doesn't appear to break anything else on the stock bluemarine theme.

darren oh’s picture

darren oh
Primary language English
Location Lakeland, Florida
commented

Here is an explanation of the CSS code:

"whitespace: normal" turns on line wrapping. "!important" keeps line wrapping from being overridden by the default style.

The width settings are no mystery: they set up table and column widths.

This code (from forum topic 59662)

* html .event-calendar .event-empty {
height: 6em;
}

has been added because Internet Explorer ignores the min-height setting and uses the height setting instead. The practical effect of "* html" is that only Internet Explorer uses this setting. See
http://www.info.com.ph/~etan/w3pantheon/style/starhtmlbug.html
for more information.

darren oh’s picture

darren oh
Primary language English
Location Lakeland, Florida
commented

After my doing my CSS research, I created a new patch. I removed "!important" from the patch to allow wrapping to be overridden by the site theme and added a backslash to the Internet Explorer code to hide it from the Mac version (which displays height correctly). See
http://www.sam-i-am.com/work/sandbox/css/mac_ie5_hack.html
for information about the backslash hack.

darren oh’s picture

darren oh
Primary language English
Location Lakeland, Florida
commented
StatusFileSize
new event.css_2.patch1.29 KB

And here is the patch.

killes@www.drop.org’s picture

killes@www.drop.org commented
Status: Reviewed & tested by the community » Fixed

applied

skor’s picture

skor commented

Darren Oh: Thanks for the explanation. I was especially puzzled by "!important".

Talking to myself:

Doesn't this CSS thing tell the browser where all this stuff goes? Aren't all they all important?

Anonymous’s picture

(not verified) commented
Status: Fixed » Closed (fixed)