This browser is no longer supported.
Upgrade to Microsoft Edge to take advantage of the latest features, security updates, and technical support.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(153.6, 75%, 24%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EKF%3C/text%3E%3C/svg%3E)
Most of the CSS in https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.css is name-spaced as mapbox, azure, or atlas but some of it isn't, e.g.:
.map-copyright {
.marker-container {
.popup-container {
.popup-close {
.popup-arrow {
.incident-popup-content {
font-face {
font-family: standard;
src: url(https://atlas.microsoft.com/styles/glyphs/standardfont.ttf)
.font-standard {
font-family: standard
.top-left.subcontrol-container {
.hidden {
.traffic-legend {
The .hidden rule caused an issue for us and we'd to add a special-case rule to override it.
Thanks for pointing this out. Looks like half of the CSS classes are namespaced and half aren't. Will pass this on to the dev team.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(288, 6%, 37%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EBP%3C/text%3E%3C/svg%3E)
Is there any update on this? We seem to be getting conflicts with the generic global names here.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(108.80000000000001, 81%, 20%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EDC%3C/text%3E%3C/svg%3E)
Hi
Sorry for the late response.
We will get this done later, probably in Aug./Sep., will update back here.
Denise
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(163.2, 27%, 25%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3ERJ%3C/text%3E%3C/svg%3E)
Any update on this?
I got the same issue on the 'hidden' classname. Since TailwindCss is using this classname as well. And they work differently from each other (display vs. visibility prop)