Span tag with display: embedded rendering as display: block

Question

I have a span tag like this

<td>
<s:textfield name="trnfr" id="trnfr"/>
<span id="trnfrm" style="width:10px;display:inline;">
  &nbsp;
  <a onClick="showCal('trnfrm')"><img src="./images/cal.gif" border="0"
  alt='<s:text name="Co.Cal" />' /> </a>
</span>
</td>

It should display as

but this is a rendering like this

when I looked at the source in the browser, it is displayed in this way

I don’t know what is going wrong.

Note. I got the correct image by changing the display: block to display: built-in dynamically in the browser.

Answer 1

You cannot easily override in your CSS, because the element is set to display:blockinline (inside your HTML), most likely using the structure used (it's hard to say without further details).

, , (, JS), CSS.

CSS, !important, :

#trnfrm{
  display:inline!important;
}

, , !important . .

!important, , CSS, . !important . ! , , , .

Answer 2

img span . div, "trnfr", div : inline-block ".

Answer 3

This is a CSS issue. Provide some more data.