JSFiddle - React, Tailwind, and code Playground

by josh3736

HTML

<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.css">
<script src="http://cdn.leafletjs.com/leaflet-0.4/leaflet.js"></script>
<div id="map"></div>
<h1>Welcome</h1>

CSS

body { padding:0; margin:0; }
#map { z-index:-1; position:absolute; width:100%;height:100%; margin:0; padding:0; }

JavaScript

var map = L.map('map').setView([51.505, -0.09], 13);
L.tileLayer('http://otile1.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png', {
    attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, tiles Courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
    maxZoom: 18
}).addTo(map);