Skip to Content (Press Enter)
2019-07-25 15-17-44
Christopher Robin-Kennedy
82Views
2Comments
Solved
CSS works in Chrome but not in IE
Question
CSS
OutSystems Widgets

I have reposted this, I didnt realise my previous post was under a forge item. I have deleted the previous post. 


In my application I have some counters at the top of the main screen which looks like this.

However In IE this looks like : 


The counters are made up of a Webblock with structure: 

And the Stack/ StackAbove CSS: 


I have added min-height and height being less than min-height and the "display: Block" after looking at a few similar issues on a different forum: https://github.com/philipwalton/flexbugs/issues/231 However this hasnt resolved the issue

I am not sure how to change this so it works on IE and Chrome. Any Help would be appreciated.

The version is IE 11.1331.16299.0

Update Versions: 11.0.140 


I have also emulated this on IE10 and IE9 but the issue persists. 


C

0
0
21 Oct 2019
Copy Link
2016-04-21 18-13-58
Nuno Rolo
 
MVP
Solution

Hi,

Please note that the instruction -webkit is specific for chrome or browsers that are based on WebKit that's not the case of IE.

0
0
21 Oct 2019
Copy Link
2019-07-25 15-17-44
Christopher Robin-Kennedy

Nuno Rolo wrote:

Hi,

Please note that the instruction -webkit is specific for chrome or browsers that are based on WebKit that's not the case of IE.

Thanks Nuno, 


I just added 


transform: translateX(-50%) translateY(-50%);


To the CSS which has then resolved the issue. 



1
0
21 Oct 2019
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.