Welcome, Guest

Author Topic: Seems two CSS bugs  (Read 451 times)

MidnightFifteen

  • Posts: 6
    • View Profile
Seems two CSS bugs
« on: March 09, 2018, 12:50:06 AM »
Hello, I'm working using Coherent 1.14.5.10 with UE 4.17

I met two glitches, which looks like css bugs.

1.

In my main menu, semi-transparent background may disappear.

In my previous version (maybe 1.11 with UE 4.14 I forgot) it worked correctly.

co2.png shows glitch in UE4,
co2cp.png shows the correct rendering in chrome.

I use ::before to implement my semi-transparent background
and when I move my selecting bar (by means of removing and adding class "selecting"),
bgs of some of the items disappeared, even though I hadn't changed their classList.

As I tested
Code: [Select]
transform: rotateY(30deg);
transition: all 0.1s;

disabling transform will make the bg work almost well,
except that the last item abnormally blink each time I move bar.
I must also disable transition to make things fine.

When I hover on the Coherent Debugger, it seems to forcing redraw and the the bg comes back.

My css appled showed in Coherent Inspector:
https://i.imgur.com/kyt7q3p.png


2.

It seems that auto break line (word-wrap) for non-English character does not work correctly.

co1.png shows correct line breaking for digits and incorrect line breaking for Chinese characters.

In the green box, one Chinese character overflows
( I guess the way you count the width is wrong, so the break point is wrong too)

In the red box, a very wide div containing a very long piece of Chinese characters,
it seems that wrong width result causes the wrong prefix margin to match text-aligned:center
and cause many characters overflow.

And the overflowed texts are left alone, not rendered even when the red box disappears (visibility:hidden).

co1cp.png shows the correct rendering in chrome.

The word wrapping rule for Chinese character is that a break point can be inserted right after any character,
not relying on white-space.

Here's my test data for example:
Code: [Select]
<div style="position:absolute;top:50%;border:2px lime solid;width:150px;overflow-wrap:break-word;font-size: 6vh;text-align: center;">123456789<br/>我愛你沒有期限,如果有,就把它刪掉</div>

john.v

  • Administrator
  • *****
  • Posts: 76
    • View Profile
Re: Seems two CSS bugs
« Reply #1 on: March 15, 2018, 05:18:17 AM »
Hello MidnightFifteen,

I created a setup, similar to yours, but I could not reproduce the issues you're experiencing. I'm attaching the page that I tested with.

Could you please contact me at support@coherent-labs.com and send me a minimal sample that demonstrates those issues there?

John V,
Support Engineer at Coherent Labs
 

Tags: