Problem with TEXT-OVERFLOW

[FancyPrairie]

I have a table with a span tag and an input tag. I want to clip the values in both tags. That is, if the value I put in the span tag and/or input tag is too long to display in the tag I want it clipped with an ellipsis print at the end.

Should look something like this:

Select... My input box is trun...

I had this working at one time but I must have changed something because although the span tag works, the input tag does not.

Here's the code:

<table cellpadding='0' cellspacing='0' border='1' style="border: red; width: 1px;TABLE-LAYOUT: fixed; OVERFLOW: visible; WIDTH: 155px ">
    <tr>
        <td   style="width: 45px; height: 25px;">
            <span style="OVERFLOW: hidden; WHITE-SPACE: nowrap; TEXT-OVERFLOW: ellipsis; display:inline-block;background-color:Transparent;border-color:Transparent;border-width:0px;height:23px;width:45px;">Select Something:</span>
        </td>
        <td style="width: 145px; height: 25px;">
            <input id="Text2"  style="OVERFLOW: hidden; WHITE-SPACE: nowrap; TEXT-OVERFLOW: ellipsis;  display:inline-block; width: 145px; height: 25px;" />
        </td>

    </tr>
</table>

 

[vacunita]

From what I can gather it has a varied levels of support across browsers with FF not supporting it at all. And other browsers having less than full support.

IE7 handles it just fine though not in the submit button.
IE8 seems to ignore it completely.

So its going to be hard to expect consistent results across browsers, and version there of.


----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

 

[FancyPrairie]

From what I've read on the net, it should be supported for IE5 and above. But I can't get it to work on IE6.

 

[vacunita]

It works for me for the span, but not the textbox.

IE6.0.2900.2180

Maybe the textbox element doesn't support that css property in any browser.

Also what doctype are you using?


----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

 

[ChrisHunt]

Support of CSS is very variable when it comes to <input> elements, even for well-established and supported properties. See

http://www.456bereastreet.com/archive/200705/why_styling_form_controls_with_css_is_problematic/

and the articles it links to for more information.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd