css right align inside span element

Question

I want to align an image in the right side of a span element.

I had this working fine inside a td element but it is not working now that I've moved it into a a span. Would appreciate any suggestions.

<div style="width:400px;">
    <span style="display:inline-block;width:50%;" onclick="location.href='http://www.google.com'">Go to Google</span><span style="display:inline-block;width:50%;float:right;weight:bold;" onclick="location.href='http://www.yahoo.com';><img src="test.gif" width=40 height=40 border=0>Go to Yahoo</span>
</div>

http://jsfiddle.net/sVdE3/

Answer 1

How about this?

<div>
    <span onclick="location.href='http://www.google.com';">Go to Google
        <img src="https://www.google.com/images/srpr/logo11w.png" width="40" height="40" border="0" />
    </span>
    <span onclick="location.href='http://www.yahoo.com';">Go to Yahoo
        <img src="https://www.google.com/images/srpr/logo11w.png" width="40" height="40" border="0" />
    </span>
</div>

And the following for the CSS:

div {
    width: 400px;
}
span {
    display: inline-block;
    width: 50%;
    float: left;
}
img {
    float: right;
}

http://jsfiddle.net/grim/sVdE3/2/

Note that you have some errors in your markup such as quotes (") that you didn't close.