A
A
Artur Harutyunyan2019-02-07 21:11:30
css
Artur Harutyunyan, 2019-02-07 21:11:30

Gradient text on IE 10+?

Hello everyone, I'm in despair, but I don't give up, for applying for my first job, I was puzzled to make a cross-browser adaptive - to hell with them, I'll do it or almost did it ....
There is one problem for me, I searched the Internet up and down, I can't make a gradient text which would be readable on IE ...
On all other browsers, zbs, IE does not plow, they asked me to do it and under it
I beg you to help brothers

.main-travel__title {
  text-transform: uppercase;
  font-size: 58px;
  line-height: 0.9;
  font-family: 'Museo Sans Cyrl 700';
  background-color: #ffa184;
  /* IE9, iOS 3.2+ */
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0idnNnZyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMTAwJSIgeTI9IjAlIj48c3RvcCBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNmZjQyMDgiIHN0b3Atb3BhY2l0eT0iMSIgb2Zmc2V0PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI3ZzZ2cpIiAvPjwvc3ZnPg==");
  /* Android 2.3 */
  /* IE10+ */
  background-image: -webkit-gradient(linear, left top, right top, from(white), to(#ff4208));
  background-image: linear-gradient(to right, white 0%, #ff4208 100%);
  background-image: -ms-linear-gradient(left, white 0%, #ff4208 100%);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
}

5c5c74c81825e157661934.jpeg

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question