Google Maps API marker move on scroll and layout style

Question

I'm new in the Google Maps API, I am trying to embed a marker with the address on google maps but I have errors.

https://developers.google.com/maps/documentation/javascript/adding-a-google-map#map

I'm using this documentation and I have copied this code but it doesn't work properly because when you scroll the marker it's not fixed in the map but its move and doesn't stay in the correct place.

Also, the buttons in the left corner MAP and SATELLITE doesn't appear properly, they appear with a background line in the whole map and don't together smaller.

Finally, the + and - button doesn't appear.

Someone could tell me why I have all this problem?

Here is my code:

<script>
function initMap() {
 var blitz8 = {lat: 45.806510, lng: 10.109520};
 var map = new google.maps.Map(document.getElementById("map"), {
  zoom: 18,
  center: blitz8
});
var marker = new google.maps.Marker({
 position: blitz8,
 map: map
 }); 

};
</script>

Answer 1

Hi I resolve that problem by disabled some css option in your base.scss please check and fix that, check my picture uploaded below