Reply To: Map using Mapbox shows oddly on large mashup

Home Forums MapPress Support Map using Mapbox shows oddly on large mashup Reply To: Map using Mapbox shows oddly on large mashup

#18472
Chris
Keymaster

Hi,

It looks like this is due to the theme interfering with the Leaflet map styles.  I’ve pasted one of the relevant theme sections below.
In most browsers you can open development tools using F12, which will let you see what CSS is applied to a particular element.
For example, it looks like the theme is applying background: #fff to ALL images on the page, including the map icons.
Some options to fix it include:
a) Switch themes
b) Remove that CSS from the theme’s ‘styles.css’
c) Add you own override at the bottom of syles.css, for example:
.mapp-layout img { background: none !important; }
Here’s the styles.css section:

.post img,
.type-page img,
.type-feature img,
.type-testimonial img,
.type-portfolio img,
.search-results .page img,
.search-results .type-product img,
.search-results .type-feature img,
.search-results .type-testimonial img,
.search-results .type-portfolio img,
.post img.thumbnail,
.type-page img.thumbnail,
.type-feature img.thumbnail,
.type-testimonial img.thumbnail,
.type-portfolio img.thumbnail,
.search-results .page img.thumbnail,
.search-results .type-product img.thumbnail,
.search-results .type-feature img.thumbnail,
.search-results .type-testimonial img.thumbnail,
.search-results .type-portfolio img.thumbnail {
  /* padding: .53em; */
  /* border: 1px solid #eaeaea; */
  background: #fff;
  max-width: 100%;
  height: auto;
}