<!doctype html>
<html>
        <head>
        </head>
	<body>
		<div id="map"></div>
                <script src="http://localhost:9810/compile?id=ol&mode=RAW" type="text/javascript"></script>
		<script>

			var target = document.getElementById('map');
			var map = new ol.Map(target);

			var layer = ol.TileLayer.createOpenStreetMap({
				'opacity': 0.5,
				'visible': true
			});
			map.getLayers().push(layer);

		</script>
	</body>
</html>

<!doctype html>
<html>
        <head>
		<style type="text/css">
			html, body, #map {
				margin: 0;
				overflow: hidden;
				padding: 0;
				height: 100%;
			}
		</style>
        </head>
	<body>
		<div id="map"></div>
                <script src="http://localhost:9810/compile?id=ol&mode=RAW" type="text/javascript"></script>
		<script>

			var target = document.getElementById('map');
			var map = new ol.Map(target);

			var layer = ol.TileLayer.createOpenStreetMap({
				'opacity': 0.5,
				'visible': true
			});
			map.getLayers().push(layer);

		</script>
	</body>
</html>

Add CSS to ensure map fills body
Add CSS to ensure map fills body
