Openlayers 3 popover將每個單詞放在同一行上

Question

正在使用OL3地圖，並且遇到了彈出式樣式。我沒有添加任何CSS來改變它，它目前正在通過默認的Bootstrap設置來處理。

好吧所以問題是：每個單詞都顯示在它自己的行上。我該如何改變這一點？或者，更好的問題是，我如何控制彈出窗口的風格？

這是它看起來像現在：http://i.imgur.com/lrLYbag.png

代碼處理彈出窗口：

//popups 
    var element = document.getElementById('popup'); 
    var popup = new ol.Overlay({ 
     element: element, 
     positioning: 'bottom-center', 
     stopEvent: false 
    }); 
    map.addOverlay(popup); 

    // display popup on hover 
    map.on('pointermove', function(evt) { 
     var feature = map.forEachFeatureAtPixel(evt.pixel, 
      function(feature, layer) { 
      return feature; 
      }); 
     if (feature) { 
     var geometry = feature.getGeometry(); 
     var coord = geometry.getCoordinates(); 
     popup.setPosition(coord); 
     $(element).popover({ 
      'placement': 'top', 
      'html': true, 
      'content': feature.get('name') 
     }); 
     $(element).popover('show'); 
     } else { 
     $(element).popover('destroy'); 
     } 
    }); 

謝謝！

Answer 1

我想你只需要添加一些CSS到你用於彈出的#popup元素。

喜歡的東西：

#popup { 
    min-width: 280px; 
} 

在這個例子中http://openlayers.org/en/master/examples/popup.html看一看的造型理念。