right borders not rendering.....

Martin Gosling

unread,

Mar 13, 2003, 3:08:36 PM3/13/03

to

I have set up a table and set a cell border using the style attribute of the
<td> tag so:

...all pretty standard stuff really.

Now if by entering some text into the cell, the text happens to wrap within
the middle of an emphasised section (using the <em> tag) the right border
disappears! Strange, but true.

Questions:

1) Am I breaking some DHTML/CSS rules maybe?
2) Is this a problem with IE?

Any insights would be greatly appreciated.

Incidentally, two workarounds:

1) Ensure text doesn't wrap within emphasised text
2) Wrap each word of the emphasised text in its own <em> tag (tedious!)

Kiran Math

unread,

Mar 14, 2003, 9:31:46 AM3/14/03

to

Martin Gosling

Try closing the em tag.

<em> this a </em> test.

Hope that works
Kiran Math

Kiran Math

unread,

Mar 14, 2003, 9:58:05 AM3/14/03

to

Try this code
------- start code --------
<tr >

<td style="font-family: Verdana, Arial,

Helvetica,sans-serif;font-size:8pt;text-align:left; border:1px solid

#0f4fc5;background-color:#ffffff;padding:3px">

<em> this is tu rea asd fasd fa </em>asd fasdfa sdas dfasdf
</td>

</tr>

--------- End code -------

Hope that helps
Kiran Math

Martin Gosling

unread,

Mar 14, 2003, 10:35:31 AM3/14/03

to

Thanks Kiran, but not really - I want justified text. Sure you're suggestion
is a workaround in addition to my other two, with the disadvantage that it
doesn't give me what I want.

Is this 'problem' a problem of ms's rendering engine or my code?

Is it (for example) illegal (in CSS terms) to justify text in a cell with
right borders set at 1 pixel and emphasised text?

Thanks anyway.

Martin

"Kiran Math" <kira...@hotmail.com> schrieb im Newsbeitrag
news:#ZkRfoj6...@TK2MSFTNGP11.phx.gbl...

Kiran Math

unread,

Mar 14, 2003, 2:13:29 PM3/14/03

to

You want to use justified.

Try this code .....

----- start of code -----

<td style="font-family: Verdana, Arial, Helvetica,

sans-serif;font-size:8pt;text-align:justify; border:1px solid

#0f4fc5;background-color:#ffffff;padding:3px">

<div style="width=92">
asdf asd <em>fasd asdf asd
fasd fasd asd asd </em>asdf asdfasdfa asd asdf asdfasdfasdfasdf asdf asd
fasdf asd <em>fasd asdf asd
fasd fasd asd asd </em>asdf asdf asdf asd fasdf asd <em>fasd asdf asd
fasd fasd asd asd </em>asdf asdf asdf asd fasdf asd <em>fasd asdf asd
fasd fasd asd asd </em>asdf asdf asdf asd f
</div>
</td>
</tr></table>

- --------- end of code ---------------------------------

I have used the width of the div tag as 92 ( padding + border width).

I hope this works for your case.

Kiran Math

Martin Gosling

unread,

Mar 17, 2003, 7:46:39 AM3/17/03

to

Excellent! Thanks for the fix.

But why do I need to wrap the text in a fixed width <div> tag? I guess this
is a workaround for a MS problem. Is this correct?

Martin

"Kiran Math" <kira...@hotmail.com> schrieb im Newsbeitrag

news:eHbvM3l6...@TK2MSFTNGP11.phx.gbl...

Martin Gosling

unread,

Mar 17, 2003, 7:51:39 AM3/17/03

to

Kiran, no, sorry, it doesn't work!

in your example, you are only getting the right border as one of your lines
of data is increasing the width of the cell to over 92 pixels. Cut this line
in half and the right border disappears! Any other ideas?

Martin

"Kiran Math" <kira...@hotmail.com> schrieb im Newsbeitrag

news:eHbvM3l6...@TK2MSFTNGP11.phx.gbl...

Rowland Shaw

unread,

Mar 17, 2003, 8:05:56 AM3/17/03

to

try valid CSS for a start; Thus <div style="width=92"> becomes <div
style="width:92px">

"Martin Gosling" <martin_do...@thegoslinggroup.com> wrote...

> Kiran, no, sorry, it doesn't work!
>
> in your example, you are only getting the right border as one of your
lines
> of data is increasing the width of the cell to over 92 pixels. Cut this
line
> in half and the right border disappears! Any other ideas?
>
>

> "Kiran Math" <kira...@hotmail.com> schrieb...

Kiran Math

unread,

Mar 17, 2003, 8:59:08 AM3/17/03

to

yes, I am sorry for that.
<div> style="width:92px">
Typo.

Well Martin, you cannot increase the size of the div tag more than 92 as,
You have got the padding of 3 and border is 1 px thick.
So 3 *2 + 2 *1 = 8 px.

So the width of div would be 100 - 8 = 92 px.

So any tag inside the <td> tag of width 100 px should be max 92 px. Any
thing beyond this will push the contents out of the max <td> width of 100.

I hope that makes it clear.
Thank you
Kiran Math

Kiran Math

unread,

Mar 17, 2003, 10:05:00 AM3/17/03

to

Ahhh I got what you are saying:-
The whole issue is with jutification and padding . Well..
Try this code ... might solve your problem.

--------- start code ----

<tr>
<td style="font-family: Verdana, Arial, Helvetica,
sans-serif;font-size:8pt;text-align:justify;

background-color:#ffffff; margin-left: 0; margin-right: 0;">

<div style="width:100;border:1px solid #0f4fc5;padding:3px">
<em>fasd asdf </em>sdf asd <em>fasd asdf asd fasd fasd asd
asd </em>assdfas
</div>

</td>
</tr>
</table>

-------- end code --------------

Hope that helps.
Kiran Math

Martin Gosling

unread,

Mar 18, 2003, 2:16:46 PM3/18/03

to

Kiran, spot on!

So it seems to be a problem with MS, it only working if one applies the
style to a DIV tag within the TD tag.

Interesting.

Thanks once again.

Martin
"Kiran Math" <kira...@hotmail.com> schrieb im Newsbeitrag

news:e#gHWaJ7C...@TK2MSFTNGP12.phx.gbl...