Defect #33673

Calendar View / The right side of the tooltip is cut off

Added by Akiko Takano over 2 years ago. Updated over 2 years ago.

Status:ConfirmedStart date:
Priority:NormalDue date:
Assignee:-% Done:


Target version:Candidate for next minor release
Resolution: Affected version:



The right side of the tooltip is cut off at the Calendar View.


In normal mode, the right side of the issue's tooltip is clipped.
The contents of the tooltip are hidden under the sidebar.

In responsive mode, not only the right side of the issue but also the issues on Friday are the same.


  Redmine version                4.1.1.stable.19819
  Ruby version                   2.5.3-p105 (2018-10-18) [x86_64-darwin18]
  Rails version        
  Environment                    development
  Database adapter               SQLite
  Mailer queue                   ActiveJob::QueueAdapters::AsyncAdapter

The trunk is the same situation.

Visual Proof / Screenshot

Expected Results

The tooltip is displayed without cutting off.

Actual Results

Cut off because of the content's overflow.


Modify the application.css and responsive.css


Index: public/stylesheets/application.css
--- public/stylesheets/application.css    (revision 19834)
+++ public/stylesheets/application.css    (working copy)
@@ -109,6 +109,7 @@
 #content { flex-grow: 1; background-color: #fff; margin: 0px; padding: 6px 10px 10px 10px; overflow-x: auto;}
 html>body #content { min-height: 600px; }
 * html body #content { height: 600px; } /* IE */
+html>body.controller-calendars.action-show #content { overflow-x: visible; }

 #main.nosidebar #sidebar{ display: none; }

I'm not sure if the changing of overflow-x has some unexpected effects, so I specify more specific conditions.
(Calendar view only)


Index: public/stylesheets/responsive.css
--- public/stylesheets/responsive.css    (revision 19834)
+++ public/stylesheets/responsive.css    (working copy)
@@ -847,6 +847,9 @@
     margin-left: 0;
     width: 100%;
+  /* calendar tooltip */
+ td:not(.week-number):nth-child(n+5) span.tip { right: 10px; }

 @media all and (max-width: 599px) {


after-responsive-mode.png (121 KB) Akiko Takano, 2020-06-26 16:06

after-normal-mode.png (103 KB) Akiko Takano, 2020-06-26 16:06

sample-capture.png (153 KB) Akiko Takano, 2020-06-26 16:07


#1 Updated by Go MAEDA over 2 years ago

  • Tracker changed from Patch to Defect
  • Subject changed from Calendar View / The right side of the tooltip is cut off. to Calendar View / The right side of the tooltip is cut off
  • Status changed from New to Confirmed
  • Target version set to Candidate for next minor release

Also available in: Atom PDF