---
title: "Markers"
group: mapbox
nopagepadding: true
nofooter: true
---
<style>
  #marker {
    background-image: url('https://docs.mapbox.com/mapbox-gl-js/assets/washington-monument.jpg');
    background-size: cover;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    cursor: pointer;
  }
  .mapboxgl-popup {
    max-width: 200px;
  }
</style>

<div id="map" style="position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; overflow: hidden; flex: 1 1 auto; flex-direction: row; display: flex; width: 100%; height: 100%; cursor: grab; touch-action: none; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); outline: none;"></div>