How to define a css class for a delete button in Openlayers?

Question

Define a css class for delete button in openlayers?

        .olControlDelete {
     background-image: url("help.png"); 
     background-repeat:no-repeat;
     background-attachment:fixed;
     background-position:center;
     z-index:10;
      }

Or

  div.olControlDelete {
  top: 100px;
  left: 50px;
  position: absolute;
       }

  .olControlDelete div {
  background-image: url("edit_sprite.png");
  background-repeat: no-repeat;
  width:  22px;
  height: 22px;
  border: thin solid black;
  margin-top: 10px;
}

Don,t seem to work, Please help. Last question for openlayers. please

Below Code from Vadin:

                 deleteShape = new OpenLayers.Control.SelectFeature(
polygonLayer, 
{
    displayClass: "olControlDelete",
    title: deleteFeature,
    eventListeners: {
        featurehighlighted: function overlay_delete(event) {
            var feature = event.feature;
            if( confirm(strConfirmMessage) ) { // prompt
                polygonLayer.removeFeatures( [ feature ] );
                // TODO other clean up - remove popups or send some ajax to server.  Up to you....

            }
        }
    }   
} 
       );

            map.addControl(deleteShape);

Answer 1

My control lives inside the olControlEditingToolbar [the standard one, I just add more to it] and you have to set the class for when the button is Active and Inactive

.olControlEditingToolbar .olControlDeleteItemInactive {
  background-image: url("../images/edit/delete_off.png");
}
.olControlEditingToolbar .olControlDeleteItemActive {
  background-image: url("../images/edit/delete_on.png");
}

You really should be looking at examples on the OL site. OL has "ok" documentation, but is much better documented-by-example. OL Examples