Text clipping. How can I fix this?

[zeyais]

I am using ASP.net (should be transparent in this case).

The page is generated alright. The page has fieldset, divs and tables
and other HTML elements like text box, drop downs etc; all are
standards. Also, the page is formatted/decorated using CSS.

Here is the issue:
HTML generated is alright. Except:
1. IE the text is clipped instead of wrapping the text around inside
the fieldset/div. Even the right side of the fieldsets border is not
shown as it is extended and I am assuming "pushed" below the adjacent
element.
2. FF if text is long it does not wrap nor it is clipped instead it
shows over its neighboring elements, which in my case is a table
adjacent.

Code:
The generated output:
<div style="display:block;" id="div_words" align="left">
<fieldset>
<legend>Phrase</legend>
<ul>
<li>
<a href='meaning.aspx?phrase=worrd1 what is this' >worrd1 what is
this</a>
</li>
&middot;&nbsp;
<li>
<a href='meaning.aspx?word=word this sould wrapped and all words
should be visible'>word this sould wrapped and all words should be
visible</a>
</li>
&nbsp;&middot;&nbsp;
<li>
<a href='meaning.aspx?word=info again should not be clipped or
flow over adjacent element'>info again should not be clipped or flow
over adjacent element</a>
</li>
</ul>
</fieldset>
</div>

CSS:
#div_words {float: left}
#div_words ul li{ list-style-type: none; float:left; margin: 0 10 0
-18; text-align:left; text-indent:0; color:#000}

Questions:
How can I fix this?

Additionally,
If you see the HTML I am using &nbsp;&middot;&nbsp; as seperator
between words, but in FF the &middot; is rendered before the words. How
can I fix this? I can live without this, my first need is how to fix
the clipping and overflowing of text.

Thanks.

[Jim Moe]

ze****@gmail.com wrote:

I am using ASP.net (should be transparent in this case).
No, it is not.
Here is the issue:
HTML generated is alright. [...]

No, it is not. Please validate your HTML and CSS before posting a
question. Both HTML and CSS have significant errors.
Also your posted test case does not demonstrate the problem you
describe. Post an URL to a validated, tested, test case.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

[Harlan Messinger]

ze****@gmail.com wrote:

I am using ASP.net (should be transparent in this case).

The page is generated alright. The page has fieldset, divs and tables
and other HTML elements like text box, drop downs etc; all are
standards. Also, the page is formatted/decorated using CSS.

Here is the issue:
HTML generated is alright.
What led you to think so? It isn't.

[...]
<li>
<a href='meaning.aspx?phrase=worrd1 what is this' >worrd1 what is this</a>
</li>
&middot;&nbsp;
<li>
You can't have anything but whitespace between LI elements.

[...] CSS:
#div_words {float: left}
#div_words ul li{ list-style-type: none; float:left; margin: 0 10 0
-18; text-align:left; text-indent:0; color:#000}

In the margin specification: 10 what? -18 what? Unlike HTML dimensional
attributes where numeric values are stated without units and
automatically represent pixel measurements, units need to be stated
explicitly in CSS, unless the value is 0. If you mean pixels, then you need:

margin: 0 10px 0 -18px