U4-4736 - v7: Convert RTE calculated width/height to integers

Created by Anders Brohäll 22 Apr 2014, 11:52:27 Updated by Bo Jacobsen 10 Jul 2018, 20:26:59

When inserting an image in the RTE the width and height are scaled. However, the inserted height will be presented as floats, messing with the rendering engines in the browser. For instance webkit will render decimal pixles, wich will lead to problems in a pixel-perfect world.

I suggest that the floats gets rounded to a set integer. For instance on row 6902 in umbraco.service.js (v7.1): img.originalHeight = Math.round(heightProp.value);

Comments

Joel Hansen 21 Sep 2014, 22:01:25

The float values can also cause problems with the ImageProcessor. At times it adds a thin black line of padding to make up for the non-integer float height. That is why I give this my vote.


Daniël Knippers 23 Jun 2015, 09:57:12

We have also experienced some issues with images inserted in an RTE. In particular, some images did not display at all in Internet Explorer, and this seemed to be partly caused by the decimal values in the querystring's width & height parameters. Unfortunately the behavior was not entirely reproducible, but any possible fix is welcome, including this one.


MrFlo 29 Oct 2015, 16:54:45

Hi, I've tried to add the rounded in mediahelper.js service but even with this, I have the black border.This is due to the default pad mode of the ImageProcessor tool: http://imageprocessor.org/imageprocessor-web/imageprocessingmodule/resize/ So I have added a mode=min which for half a pixel doesn't do much to the image.


Chris Mahoney 14 Dec 2015, 02:28:53

I've just stumbled upon this bug while investigating the "thin black line" issue mentioned by Joel above. It's still a problem as of 7.3.4.

Edit: And 7.4.


Dmitry 22 Dec 2015, 11:16:59

Hi. I have same problem with the "thin black line" for 7.3.1 version of Umbraco.


Matthew 11 Mar 2016, 19:55:29

What's the status on this? I'm getting a black line at the bottom of my image when inserting into a text editor. Is there a temporary solution at least? This is a huge deal breaker right now.


Yoeri Van de Moortel 23 Feb 2017, 14:52:49

A very annoying issue ... is rounding the floatvals a viable solution? I experience the bug in RTE, getting me an annoyed client :-(

Umbraco version 7.5.6


Yoeri Van de Moortel 14 Jun 2017, 09:17:48

I just ran into this issue (again) ... and solved it by using an iis rewrite rule. Non-obtrusive solution, easily removable when the issue gets fixed ;-)

Added a rule to match all jpg/jpeg extensions that has a querystring param containing height/width. Rewrite those url's and prepend bgcolor=fff to the query string.

1 - Add rewrite extension to IIS 7 (probably already there).

2 - Modify your web.config adding the following rewrite rule:

   <rewrite>
        <rules>
            <rule name="Add bgcolor paraĆ¹eter" stopProcessing="true">
                <match url=".*" />
                <conditions>
                  <add input="{REQUEST_FILENAME}" pattern="\.*(jpe?g)" />
                  <add input="{QUERY_STRING}" pattern="height=(.*)" />
                  <add input="{QUERY_STRING}" pattern="width=(.*)" />
                  <add input="{QUERY_STRING}" pattern="bgcolor=fff" negate="true" />
                  <add input="&amp;{QUERY_STRING}" pattern="^(&amp;.*)|^&amp;$" />
                </conditions>
                <action type="Redirect" url="{R:0}?bgcolor=fff" appendQueryString="false" redirectType="Found" />
            </rule>
        </rules>
    </rewrite>


Bo Jacobsen 10 Jul 2018, 20:26:59

Also got it in version 7.7.9.


Priority: Major

Type: Bug

State: Submitted

Assignee: Per Ploug

Difficulty: Normal

Category:

Backwards Compatible: True

Fix Submitted:

Affected versions: 7.2.8, 7.3.4, 7.4.1, 7.4.3, 7.6.1, 7.7.9

Due in version:

Sprint:

Story Points:

Cycle: