Ionic 4: -webkit-line-clamp property not applying on inital load

问题

Within my Ionic 4 application, I am using -webkit-line-clamp: 2 to limit the characters displayed like so:

Example of -webkit-line-clamp working

The CSS used is:

// CSS used to limit characters
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

// Other CSS properties
font-size: 14px;
font-weight: 600;
text-decoration: none;
line-height: 16px;
padding: 5px 5px 0 5px;
margin-bottom: 5px;
min-height: 38px;
text-decoration: none;
color: black;

However, when the page is loaded initially. The clamp isn't being applied in the view resulting in this (Though the other CSS properties are still being applied):

Example of -webkit-line-clamp not working on inital load

The page requires to be refreshed with ion-refresher to have the clamp be applied

Additionally, within the Chrome Devtools. The initial loading of the page show that the CSS properties are listed but the clamp is only applied when I toggle the -webkit-line-clamp property off and on:

CSS properties in Chrome Devtools

Does anyone know of a solution/workaround for this issue as well as what could be the cause of this issue?

Versions:
Ionic: 4.11.8
Angular: 8.1.3

来源：https://stackoverflow.com/questions/59750213/ionic-4-webkit-line-clamp-property-not-applying-on-inital-load