JSFiddle - React, Tailwind, and code Playground

http://stackoverflow.com/questions/7247388/end-of-css-sprite-button-dropping-off-inside-table

by tw16

HTML

<br/><hr/><br/>
<table   border="1px" cellpadding="0" cellspacing="0" width="100%"><tbody>
    
    <tr>
        <td nowrap="true" >Test</td>
        <td nowrap="true" style="padding-left: 3px">
            
            
            
            
            
            <input type="text" 
            name="test" 
            id="test" 
            style=" font-size: 10px"
            value="" 
            size="25" 
            maxlength="64" 
            class="textField "
            />
            
        </td>
    </tr>
    <tr>
        <td nowrap="true" style="padding-top: 5px">TEST</td>
        <td nowrap="true" style="padding-top: 5px; padding-left: 3px">Test</td>
        
    </tr>
    
    <tr>
        <td nowrap="true" colspan="2" align="center" style="padding-top: 5px">
            
            <span class="spriteButton buttonLarge" onclick = "submitSignInForm();">
                <span class="primaryLargeButtonSpan button_label">77777777777777777777777777777777777777777777777777777777777asdfasdfasdfasdfasdfasdfasdfasdf</span>
                <span class="primaryLargeButtonEnd" />     
            </span>
            
        </td>
        <td>
            
            <table>
                <tr><td>asdffdasasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasf</td><td>asdfasdfasdfasdfasdf34253443253452345234523452345</td>
                </table>
                </td>
                    
                    
                </tr>
                
            </tbody> </table>

CSS

.spriteButton {
    cursor:pointer;
    color:#000066;
    display: inline-block;
}

.spriteButton::-moz-focus-inner {
    border: none;
}

.spriteButton span.button_label {
    border:0;
    margin:0;
    display:block;
    white-space: nowrap;
    font-family:Arial;
    font-weight:bold;
}

span.button_label {
    display:-moz-inline-box; 
}

span.button_disabled {
    color:#a0a0a0;
}

.buttonLarge {
    height:22px;
    margin: 0 22px 0 12px;
}

.buttonLarge span {
    padding:3px 0px 7px 10px;
    font-size:12px;
}

.primaryLargeButtonEnd {
    width: 12px;
    height:12px;  
    padding: 0px 0px 0px 5px;
    display: inline-block;
    background: transparent url('http://www.lolstrategies.com/test/composite__V153767378_.png') no-repeat left -75px;
}
.primaryLargeButtonSpan {
    float: left;
    background: transparent url('http://www.lolstrategies.com/test/composite__V153767378_.png') no-repeat left top;
}