CSS image right align - extra line in Firefox 6.02
I have a right aligned image, which works fine in IE9 and Chrome 14. In Firefox 6.02 I do get an extra line. Application is using jQuery UI. How could I avoid this? Is my CSS somehow wrong, or is Firefox 6 known to be different - as far as I remember it was the same as in Chrome with FF5.
<tr class="ui-widget-content sideB开发者_StackOverflow社区arTopAlign">
<td>Data file:</td>
<td colspan="3"><div id="inputDatafileInfo">not read</div>
<button class="ui-button sideBarRightAlign">
<span class="ui-icon ui-icon-link" title="Show data file"></span></button>
</td>
</tr>
with:
/* align some elements explicitly right */
.sideBarRightAlign { float: right; margin-right: 1px; }
/* align some elements explicitly right */
.sideBarTopAlign { vertical-align: top; }
The styles from jQuery UI
button { font-family: Verdana,Arial,sans-serif; font-size: 1em; }
.ui-button { cursor: pointer; display: inline-block;
margin-right: 0.1em; overflow: visible; padding: 0;
position: relative; text-align: center; text-decoration: none !important;}
Another finding, it seems to be related to the colspan, if I move it in the last of 4 columns it displays as intended.
There was a no-wrap
applied to a parent div
section. I do not understand why this resulted in the extra line break - and only in FF - but it was the root cause.
simple
give the time span a width and display:inline-block
also for the 743 label
the problem is that the span it too long and doesnt give the img to be floated right and top
精彩评论