Can I wrap a long filename?

Question

I have a table in a fieldset that is not displayed properly (overflow) because of a long file name that I cannot wrap. Is there a way to wrap the file name that is in the table?

<table>
    <tr><td>stackoverflow.com/questions/4584756/how-can-i-make-the-datagridviewtextboxcolumn-wrap-to-a-new-line-if-its-text-is-t</td></tr>
</table>

I set the width and overflow style on the td element and still no help. Any other ideas?

On what element and what values exactly? Would ellipsis be acceptable? — Šime Vidas, Mar 19 '12 at 17:56
What browser did you test with? Mine all wrap this example perfectly. Except Amaya and some elderly ones. — Mr Lister, Mar 19 '12 at 18:09

score 2 · Answer 1 · edited May 23 '17 at 11:45

2

you can try this in css word-wrap:break-word (set a width too. This is CSS3 so might not work in older browsers)

check word wrap in css / js

edited May 23 '17 at 11:45

Community

1
1

answered Mar 19 '12 at 18:10

Rodolfo

4,155
23
38

Not bad. But can you _rap_ a long filename? – Kenan Banks Mar 19 '12 at 19:22
I am now using css3 and word-wrap is not an option :( – MrM Mar 19 '12 at 20:15

score 1 · Answer 2 · answered Apr 09 '19 at 15:11

This is what worked for me :

<td style='word-break:break-all'>
T1_C50621021900010788086700100001010000000072101000072_E107880867_R115710745_F20190221.pdf
</td>

The word-break:break-all literally breaks the long filename into pieces, each piece with same width except the last one, with an automatic width chosen by the browser (I guess you can experiment with a custom width).

score 0 · Answer 3 · edited Mar 19 '12 at 18:05

0

Have you tried this selector property and value?

element
{
    white-space: inherit;
}

edited Mar 19 '12 at 18:05

abatishchev

98,240
88
296
433

answered Mar 19 '12 at 18:00

Dylan

495
1
6
19

Pankaj · Answer 4 · 2012-03-19T18:10:58.397

0

<table><tr><td style="overflow-x: auto">your file name</td></tr></table>

This will wrap it in next line automatically

edited Mar 19 '12 at 18:10

answered Mar 19 '12 at 18:02

Pankaj

9,749
32
139
283

I tried adjusting the width but with no luck. The length of the url would still stretch the width – MrM Mar 19 '12 at 18:08
I tried the overflow style and I was still unsuccessful. Maybe I am missing something... – MrM Mar 19 '12 at 18:28

score 0 · Answer 5 · answered Mar 19 '12 at 18:04

0

In general, a browser will only wrap a text string at a space. So to get it to wrap, you'd have to insert spaces. In principle, you could check if the length is over some value and if so insert a space at a specified point, or add a space after every slash, or something like that. But if the field is updatable, you'd have to be sure to remove these spaces on input. And if the user is going to cut and paste this field, he'd get mysterious extra spaces.

answered Mar 19 '12 at 18:04

Jay

26,876
10
61
112

But the OP's example wraps perfectly with just dashes. Which browser did you test? – Mr Lister Mar 19 '12 at 18:09
I think this is the issue I am facing. My column is being adjusted based on the longest word regardless of set width. I was just afraid to make changes to the url and make edits on posting – MrM Mar 19 '12 at 18:24

score 0 · Answer 6 · answered Mar 19 '12 at 19:16

In a case like this, some browsers will not break the string at all by default, some will break after a hyphen “-”, some may also break after a slash “/”. If you really need to have a long filename in a table cell, you need to decide what you want—what would be the least of evils.

After the decision, use nobr markup to prevent line breaks and wbr markup to allow them, or their character-level or CSS counterparts (which work less widely). There are many nasty details involved; see my page on preventing and allowing line breaks.

Breaking after “-” is problematic because the reader won’t know whether the hyphen has been introduced in word hyphenation or is part of the filename itself. Then again, does this matter? What is the reader supposed to do with the long filename? In this case, the “filename” looks really like a URL without the “http://” part, and in such cases, it is better to use a descriptive link text (which may wrap freely) and put the URL where it belongs, an href attribute.

Can I wrap a long filename?

6 Answers6