Vote #80608
完了HTML entity is used in CSS string
0%
説明
Ordering handles (green arrows ↕) at some administrative pages contains HTML entity instead of inivisible character of non-breaking space:
!redmine-410-nbsp.png!
h2. Affected pages
- /roles
- /trackers
- /issue_statuses
- /enumerations
- /custom_fields
h2. Configuration
- MySQL 5.5.44
- ruby 2.6.3p62 (2019-04-16 revision 67580) [x86_64-linux]
- Rails 5.2.4.1
- Redmine 4.1.0
- Plugins:
** "Redmine CRM plugin (Light version)":https://www.redmineup.com/pages/plugins/crm 4.2.5
** "Custom JS and CSS plugin":http://github.com/shoorick/redmine_custom_js_and_css 0.0.1
** "Redmine Open Search plugin":https://github.com/Mine02C4/redmine_open_search 0.1.0 - Google Chrome 79
h2. How to fix
Edit public/stylesheets/application.css:
.icon-only::after {
content: " ";
}
replace with
- non-breaking space or
\a0
journals
<pre><code class="diff">
--- application.css~ 2019-12-20 17:19:46.000000000 +0500
+++ application.css 2020-01-17 05:28:57.819227647 +0500
@@ -1458,3 +1458,3 @@
.icon-only::after {
- content: " ";
+ content: "\a0";
}
</code></pre>
--------------------------------------------------------------------------------
I cannot reproduce the problem. Could you test again without third-party plugins and a theme?
!{width: 676px; border: 1px solid grey;}.roles-no-problem@2x.png!
--------------------------------------------------------------------------------
I’ve checked with Alternate and Classic themes — there are no visible characters
!issue-32829-hidden.png!
But anyway HTML entity should be replaced with allowed character or escape sequence.
https://developer.mozilla.org/en-US/docs/Web/CSS/string
> Most characters can be represented literally. All characters can also be represented with their respective "Unicode code points":http://en.wikipedia.org/wiki/Unicode#Code_point_planes_and_blocks in hexadecimal, in which case they are preceded by a backslash (<code>\</code>). For example, <code>\22</code> represents a double quote, <code>\27</code> a single quote (<code>'</code>), and <code>\A9</code> the copyright symbol (<code>©</code>).
> Note: HTML entities (such as <code class="html"> </code> or <code class="html">—</code>) cannot be used in a CSS <code><string></code>.
See also:
* https://developer.mozilla.org/en-US/docs/Web/CSS/content
* https://css-tricks.com/css-content/#article-header-id-1
--------------------------------------------------------------------------------
Alexander Sapozhnikov wrote:
> But anyway HTML entity should be replaced with allowed character or escape sequence.
>
> https://developer.mozilla.org/en-US/docs/Web/CSS/string
>
> > Most characters can be represented literally. All characters can also be represented with their respective "Unicode code points":http://en.wikipedia.org/wiki/Unicode#Code_point_planes_and_blocks in hexadecimal, in which case they are preceded by a backslash (<code>\</code>). For example, <code>\22</code> represents a double quote, <code>\27</code> a single quote (<code>'</code>), and <code>\A9</code> the copyright symbol (<code>©</code>).
>
> > Note: HTML entities (such as <code class="html"> </code> or <code class="html">—</code>) cannot be used in a CSS <code><string></code>.
Thank you for giving me the information. I didn't know that.
Setting the target version to 4.1.1.
--------------------------------------------------------------------------------
The change has been made in r15271 (Redmine 3.3.0). Updating the target version to 4.0.7.
--------------------------------------------------------------------------------
--------------------------------------------------------------------------------
Committed the patch. Thank you for posting the patch.
--------------------------------------------------------------------------------
related_issues
relates,Closed,21805,Improve accessibility for icon-only links