I am using geoExt and OpenLayers to plot some map. Everything worked well until I had to add some styling. To display it on the webpage, I need to use the CSS of my university and once I do that, I have some horizontal white lines between each tile (but not vertically though). The lines have always the same height. The problem seems to come only from the CSS, since if I remove it in the html (it is the first thing invoked in <head>
), everything looks correct.
Searching here and on the web, I found than some people proposed to create a CSS after everything else which sets:
.openlayers-map img {max-width: none;}
But it didn't solve anything. Is there a way to tell to a div that it needs to load no styles but the one used by OpenLayers?
Here is a sample of the code I have:
var osm = new OpenLayers.Layer.OSM(
"Open Street Map"
);
bwms = new OpenLayers.Layer.WMS(
"usa:states - Tiled", "http://128.178.82.176:8080/geoserver/usa/wms",
{
layers: "usa:states",
tiled: true,
transparent: true
},{
singleTile: true,
projection: new OpenLayers.Projection("EPSG:4326") // specified because it is different than OSM's
}
);
mapPanel = new GeoExt.MapPanel({
renderTo: "mapPanel",
map: new OpenLayers.Map({
projection: epsg900913,
displayProjection: epsg4326,
units: "m",
center: new OpenLayers.LonLat(6.59,46.39).transform(epsg4326,epsg900913)
}),
layers: [osm,bwms],
// height/width in pixels
height: 450,
zoom: 10,
border: false
});