How to Break an URL?

[kreelin]

Hi i have to display a list of url in a tables but whenver one of those url is too long it pushes the width of the containiçng cell further on the right breaking up the layout of the page etc...

How do i do to make sure those urls can be broken so they can fiot into the width of the cell?

[thamba]

I have encountered this problem many times before.

There is a solution for this that works only on IE browser.
Its a CSS property:
word-break: break-all;

But I dont prefer that solution since it works only on IE and not any other browser. What I have usually done for most situations is to fix the width of the cell to the limit I want to and to hide the text that exceeds beyond the cell width.

You can do that using the CSS property:
overflow: hidden;

This will show only characters that can fit in the width and will hide the rest.

You can also use the CSS property:
overflow: auto;

This will create a scroll bar within that cell, but which might not look so neat which I dont use too much.

Cheers!

[thamba]

I forgot to add that, if you are using a url, then it probably contains a <a href> tag, so hiding part of that text can be compromised by using the title property within the <a href> tag such that the users can see the complete url when they hold the mouse over the link.

[kreelin]

thank you

[WebJoel]

or:
http://tinyurl.com/

[kreelin]

the problem is that url i am displaying in that web app are not mine and i do not have any control over them.