CODEWITHSUNDEEP
csstwitter-bootstrapgoogle-maps-api-3
Atoq
Atoq

Reputation: 33

Google Maps unexpected padding

I'm using a google maps in my web application, can be seen in image: Google Maps padding.

The design is based on bootstrap sb-admin (http://startbootstrap.com/template-overviews/sb-admin/).

The problem is the unexpected padding of the map, marked left & right on image. I want the google map to be aligned with te 3 boxes above (the ones with 'View Details'), just like the table left of the google maps below the first box above.

When I look into the details of the google maps, I notice that not the general div is forcing the padding, but a child div (see image for details).

Any suggestions on how I can fix this or point out in which direction I should search?

Upvotes: 0

Views: 533

Answers (2)

Atoq
Atoq

Reputation: 33

Couldn't fix it with 'proper' css, but encapsulating the maps div in an other div fixed it for me:

<div class="row" > <div class="col-lg-3" id="events"></div> <div class="col-lg-9"> <div id="map"></div> </div> </div>

Upvotes: 0

Lewis Smith
Lewis Smith

Reputation: 1345

Try using 

!important

Next to your padding css. This should override any css that google is adding. Also use inspect element on chrome to identify what is creating the padding and apply the style to that!

Upvotes: 1

Related Questions