The icon for the Locate widget does not appear in IE11 and I've replaced it like so:
.esri-icon-locate:before { content: "\e949";}
But it still doesn't appear. Tried on IE11 on multiple PCs but still doesn't appear. Anyone know how to fix this?
Still broken in 4.10 for IE.
The span inside Locator div should have class='esri-icon esri-icon-locate', but it has only class='esri-icon'.
I solved it with CSS
<SPAN class="selector token">.esri-locate .esri-icon:before</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="property token">content</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"\e630"</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="selector token">.esri-locate .esri-icon-loading-indicator:before</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="property token">content</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"\e65e"</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="selector token">.esri-locate .esri-icon</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="property token">font-family</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'CalciteWebCoreIcons'</SPAN> <SPAN class="important token">!important</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="property token">speak</SPAN><SPAN class="punctuation token">:</SPAN> none<SPAN class="punctuation token">;</SPAN> <SPAN class="property token">font-style</SPAN><SPAN class="punctuation token">:</SPAN> normal<SPAN class="punctuation token">;</SPAN> <SPAN class="property token">font-weight</SPAN><SPAN class="punctuation token">:</SPAN> normal<SPAN class="punctuation token">;</SPAN> <SPAN class="property token">font-variant</SPAN><SPAN class="punctuation token">:</SPAN> normal<SPAN class="punctuation token">;</SPAN> <SPAN class="property token">text-transform</SPAN><SPAN class="punctuation token">:</SPAN> none<SPAN class="punctuation token">;</SPAN> <SPAN class="property token">line-height</SPAN><SPAN class="punctuation token">:</SPAN> 1<SPAN class="punctuation token">;</SPAN> <SPAN class="property token">-webkit-font-smoothing</SPAN><SPAN class="punctuation token">:</SPAN> antialiased<SPAN class="punctuation token">;</SPAN> <SPAN class="property token">-moz-osx-font-smoothing</SPAN><SPAN class="punctuation token">:</SPAN> grayscale<SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
Only way I found to get around it is:
setTimeout(function(){ locateBtn.domNode.innerHTML = "<span aria-hidden='true' class='esri-icon esri-icon-locate'></span><span class='esri-icon-font-fallback-text'>Find my location</span>"; }, 3000);
This bug seems to be fixed with 4.12
Signed in members can post, follow updates, and more. New here? Register a free account.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.
