プロジェクト

全般

プロフィール

Vote #76274

完了

Issues reports table header overlaping

Admin Redmine さんが3年以上前に追加. 3年以上前に更新.

ステータス:
Closed
優先度:
通常
担当者:
-
カテゴリ:
UI_10
対象バージョン:
開始日:
2022/05/09
期日:
進捗率:

0%

予定工数:
category_id:
10
version_id:
136
issue_org_id:
19578
author_id:
125468
assigned_to_id:
332
comments:
9
status_id:
5
tracker_id:
1
plus1:
0
affected_version:
closed_on:
affected_version_id:
70
ステータス-->[Closed]

説明

Hi,

After migrating from Redmine 1.2.1 to 3.0.1, the Issues > Summary > Reports details page does not have the same behaviour for the table header overflow.

We use around 20 "Issues statuses" in our Redmine instance and with this latest Redmine version, headers overlap to fit in the window size which make them unreable (see attached screenshots).
This change might have been done before the Redmine 3.0.1 release but I did not find the entry about it in Changelogs.

Thanks,
Antoine


journals

I confirmed this behavior. It is caused by
<pre>
table.issue-report {table-layout:fixed;}
</pre>
source:trunk/public/stylesheets/application.css@14155#L173
If I change it to _table-layout:auto_ . I can see all the content.
You can fixed this by creating a custom theme to change this style. Just while waiting for a patch.
--------------------------------------------------------------------------------
Thanks, it works fine.
--------------------------------------------------------------------------------

--------------------------------------------------------------------------------

--------------------------------------------------------------------------------
Leonel Iturralde wrote:
> If I change it to _table-layout:auto_ . I can see all the content.

Thank you for the workaround.

But changing table-layout property from @fixed@ to @auto@ causes other problem. Please see the screenshots blow. The right end of the table is not displayed (actually there are columns "status nine", "Open", "Closed", "Total"). And columns are not aligned in issues summary page.

*Before fix:*
!{border: 1px solid #ccc;}.table-layout-fixed@2x.png!

*After:*
!{border: 1px solid #ccc;}.table-layout-auto-report-detail@2x.png!

!{border: 1px solid #ccc;}.table-layout-auto-summary@2x.png!

I think adding @white-space: nowrap@ to th elements is better solution.

<pre><code class="diff">
Index: public/stylesheets/application.css
===================================================================
--- public/stylesheets/application.css (revision 17048)
+++ public/stylesheets/application.css (working copy)
@@ -274,6 +274,7 @@
tr.issue.idnt-9 td.subject {padding-left: 152px; background-position: 136px 50%;}

table.issue-report {table-layout:fixed;}
+table.issue-report th {white-space: normal;}

tr.entry { border: 1px solid #f8f8f8; }
tr.entry td { white-space: nowrap; }
</code></pre>

!{border: 1px solid #ccc;}.white-space-normal-report-detail@2x.png!
--------------------------------------------------------------------------------
Setting target version to 3.3.6.

*Before:*
!{border: 1px solid #ccc;}.table-layout-fixed@2x.png!

*After:*
!{border: 1px solid #ccc;}.white-space-normal-report-detail@2x.png!

--------------------------------------------------------------------------------

--------------------------------------------------------------------------------
Committed to the trunk.
--------------------------------------------------------------------------------
Merged to 3.4-stable and 3.3-stable.
--------------------------------------------------------------------------------


related_issues

relates,Closed,15307,HTML 5 deprecates width and align attributes
relates,Closed,27772,Issues reports should show only statuses used by the project

Admin Redmine さんが3年以上前に更新

  • カテゴリUI_10 にセット
  • 対象バージョン3.3.6_136 にセット

他の形式にエクスポート: Atom PDF

いいね!0
いいね!0