Openlayers / Openstreetmap background is vertically striped and squished

Question

So the background of my openlayers implementation appears to be squished into vertical stripes. The weird thing is that it wasn't always like this but even when I stash all my changes back to a point where I know it was working, it still is broken. It makes me wonder if perhaps something has changed about the way the tile assets are being delivered. I have tried switching between using osm and wms layers with no change, any help would be appreciated. Here is the pertinent code: ``` initMap: function() { var view = this; var map = this.map = new OpenLayers.Map(); map.render(this.$map[0]); var wmsLayer = new OpenLayers.Layer.WMS( "OpenLayers WMS", "http://vmap0.tiles.osgeo.org/wms/vmap0?", {layers: 'basic'}); var osmLayer = new OpenLayers.Layer.OSM(); this.layers = { point: new OpenLayers.Layer.Vector("Point Layer"), line: new OpenLayers.Layer.Vector("Line Layer"), polygon: new OpenLayers.Layer.Vector("Polygon Layer") }; this.setValue(this.value); map.addLayers([this.layers.point, this.…

Accepted Answer

So I found the problem. Twitter bootstrap has a line in its reset file that sets:

```
img { max-width: 100% }
```

This was squishing the images. You can fix it by doing:

```
img { max-width: none; }
```

Openlayers / Openstreetmap background is vertically striped and squished

Solution

Problem