Openlayers: Control.Zoom

[J_Mnemonic]

Подскажите пожалуйста. Добавил Control.Zoom на карту, но почему то со стилями какая то проблема. уже брал стили из примеров. но никак не получается привести их к нормальному цвету - прозрачные и хоть ты допни.
Подскажите пожалуйста, какие именно стили отвечают за это? чтоб было как в примере. (как везде в примерах)

[J_Mnemonic]

Вроде бы вот кусок из OpenLayers.js

Код: Выделить всё

OpenLayers.Control.Zoom = OpenLayers.Class(OpenLayers.Control, { zoomInText: "+", zoomInId: "olZoomInLink", zoomOutText: "\u2212", zoomOutId: "olZoomOutLink", draw: function () { var a = OpenLayers.Control.prototype.draw.apply(this), b = this.getOrCreateLinks(a), c = b.zoomIn, b = b.zoomOut, d = this.map.events; b.parentNode !== a && (d = this.events, d.attachToElement(b.parentNode)); d.register("buttonclick", this, this.onZoomClick); this.zoomInLink = c; this.zoomOutLink = b; return a }, getOrCreateLinks: function (a) {
    var b = document.getElementById(this.zoomInId),
c = document.getElementById(this.zoomOutId); b || (b = document.createElement("a"), b.href = "#zoomIn", b.appendChild(document.createTextNode(this.zoomInText)), b.className = "olControlZoomIn", a.appendChild(b)); OpenLayers.Element.addClass(b, "olButton"); c || (c = document.createElement("a"), c.href = "#zoomOut", c.appendChild(document.createTextNode(this.zoomOutText)), c.className = "olControlZoomOut", a.appendChild(c)); OpenLayers.Element.addClass(c, "olButton"); return { zoomIn: b, zoomOut: c}
}, onZoomClick: function (a) {
    a = a.buttonElement;
    a === this.zoomInLink ? this.map.zoomIn() : a === this.zoomOutLink && this.map.zoomOut()
}, destroy: function () { this.map && this.map.events.unregister("buttonclick", this, this.onZoomClick); delete this.zoomInLink; delete this.zoomOutLink; OpenLayers.Control.prototype.destroy.apply(this) }, CLASS_NAME: "OpenLayers.Control.Zoom"

вот эти классы как я понимаю должны быть: olControlZoomIn, olControlZoomOut, olButton
и они вроде есть у меня в стилях:

Код: Выделить всё

a.olControlZoomIn {
    border-radius: 4px 4px 0 0;
}
a.olControlZoomOut {
    border-radius: 0 0 4px 4px;
}

div.olControlZoom a, div.olControlTextButtonPanel .olButton {
    display: block;
    margin: 1px;
    color: white;
    font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    background: #130085; /* fallback for IE - IE6 requires background shorthand*/
    background: rgba(0, 60, 136, 0.5);
    filter: alpha(opacity=80);
}
div.olControlZoom a:hover, div.olControlTextButtonPanel .olButton:hover {
    background: #130085; /* fallback for IE */
    background: rgba(0, 60, 136, 0.7);
    filter: alpha(opacity=100);
}
@media only screen and (max-width: 600px) {
    div.olControlZoom a:hover, div.olControlTextButtonPanel .olButton:hover {
        background: rgba(0, 60, 136, 0.5);
    }
}

не могу понять в чём дело...

проверил под FF - работает...
но ведь множество примеров, в том числе скрины которых я сюда приложил - под IE нормально работают...

[Denis Rykov]

Вам нужен дефолтный стиль контрола? Тогда непонятно для чего самостоятельно писать css, если он идет в комплекте с OpenLayers.

[J_Mnemonic]

я не писал его. я его скопировал из какого то примера. ну а во-вторых, в FF то всё окей... только в IE не цепляются стили у меня. я даже делал так - брал полностью все стили из примеров, которые даже под IE отображаются нормально, и всё равно тоже самое. вот от сюда брал openlayers.org/dev/examples/zoom.html
пришлось делать кустомные кнопки, но они не такие стильные как "родные"
Есть идеи?