Refering to icon-file in CSS - does not work on mobile devices


#1

Hey,

In my CSS-file I’ve defined a class for a custom icon with the following code:
.icon-runner {
content: url("…/…/ico/runner.svg");
width: 24px;
height: 32px;
padding: 6px 4px 2px;
opacity: 0.8;
}

The icon shows up with with both “ionic serve” and “ionic emulate ios”, but doesn’t display on real, physical devices (Android and iOS).

I think the problem is due to how Gulp runs the build script, i.e. the current path in the CSS-file is set to ‘www/build/css/’, and therefore I try to navigate back to the ‘www/ico’-folder, by using ‘…/’. A solution would be to include the icon-file in the css-build-folder, but I can’t seem to get this to work.

Is there anyone here who’ve had a similar problem?


#2

No one who have experienced a similar problem?


#3

I experienced, in both mobile as well as web.
Still not solved .