How to Style ButtonCell in CellTable Gwt?

I searched on internet & found 2 solutions:

-Solution 1: use urColumn.setCelLStyleNames("yourStyleName"); (Adding style to a ButtonCell)

ButtonCell nextStepButton=new ButtonCell();
Column<String[], String> nextStepColumn = new Column<String[], String>(nextStepButton) {

        @Override
        public String getValue(String[] oneOrder) {
            return oneOrder[11];
        }
};
nextStepColumn.setCellStyleNames(getView().getRes().css().buttonCell());

in CSS

.gwtButton, .buttonCell.getButton {
  margin: 0;
  padding: 5px 7px;
  text-decoration: none;
  cursor: pointer;
  cursor: hand;
  font-size:small;
  background: black;
  border:1px solid #bbb;
  border-bottom: 1px solid #a0a0a0;
  border-radius: 3px;
 -moz-border-radius: 3px;
  color: white;

}

I tried but nothing happened.

-Solution2: modify ButtonCell (https://code.google.com/p/google-web-toolkit/issues/detail?id=7044)

               ButtonCell nextStepButton=new ButtonCell(){
                    // A native button cell doesn't have the gwt-button class, which makes it
                      // look weird next to other gwt buttons. Fix that here.
                      @Override
                      public void render(
                          final Context context,
                          final SafeHtml data,
                          final SafeHtmlBuilder sb) {
                        sb.appendHtmlConstant("<button type=\"button\" class=\"gwt-Button\" tabindex=\"-1\">");
                        if (data != null) {
                          sb.append(data);
                        }
                        sb.appendHtmlConstant("</button>");
                      }
                };

for the solution2, i can see the difference (ie the Style of ButtonCell got changed). However, I don't have "gwt-Button" css class but only have "gwtButton" css class (see the above css). However, when I change "gwt-Button" to "gwtButton" in the the 2nd code sb.appendHtmlConstant("<button type=\"button\" class=\"gwtButton\" tabindex=\"-1\">"); then nothing happened.

So, How to style Button cell so that it can pick up the gwtButton css class

Solution

If the code posted is what you have in your page, you have an error in the selector, unless you did a mistake when copying to your question.

try changing .buttonCell.getButton with .buttonCell.gwtButton
or change .buttonCell.getButton with just .gwtButton

[EDITED]

Ok, I see the error, you are setting the style to the container of the button, so you have to change your selector. Use this one in your css resource:

.gwtButton button {
  margin: 0;
  padding: 5px 7px;
  ...
}