How do I get Internet Explorer & Opera to display this text correctly

This web page div displays correctly in Firefox and Chrome

enter image description here

But looks ugly in Internet Explorer and Opera

enter image description here

My HTML Code is:

            <div class="newAd">
                <span id="newAdButton">
                    Create a new advert for FREE!
                </span>
            </div>

And the CSS is:

.newAd {
    margin: 0 auto;
    margin-bottom: 25px;
    margin-top: 20px;
    width: 500px;
}

#newAdButton {
    margin: 10px 30px 10px 30px;
    padding: 10px 40px 10px 40px;
    background-color: #88FF88;
    color: #000000;
    font-size: 27px;
    border-radius: 20px;
    border: 5px solid #00FF00;
    -moz-border-radius: 20px; 
    -webkit-border-radius: 20px; 
    -o-border-radius: 20px;
    cursor: pointer;
    word-spacing: 0px;
}

Please how can I make it work for IE and Opera? Thanks.

Solution

You can use button tag instead of span and apply id to button tag. Hopefully it'll display properly.