Template talk:Nowraplinks

David testing nowraplinks

This section has been repeatedly edit by me for testing purposes and to reflect that the CSS code is now added to common.css so everyone can use it directly. --David Göthberg 15:05, 19 August 2007 (UTC)

This template stops word wraps inside links (links with blanks in) and only allows word wraps between the links and in normal text. This is useful for instance for long link lists. It works similar to {{nowrap}}, but the method here gives much shorter and easier to use code.

I have implemented this as {{nowraplinks}} and {{nowraplinks end}}. This functionality could also be included in templates such as {{Navbox}}. The reason I use the {{nowraplinks end}} instead of using {{nowraplinks | The link list as parameter}} is that that would mean using a pipe "|" and that doesn't work inside other templates such as {{Navbox}}.

The actual code that does the job is this CSS code:

.nowraplinks a { white-space: nowrap; }

and this code:

<span class="nowraplinks"> Link list </span>

The class "nowraplinks" that I use to stop word wrapping in the middle of the links is now declared in common.css so everyone can use it.

To view the source code of the examples below simply click the edit button on this page, not on the Espionage boxes. But click the "show" button on the Espionage boxes to see the link lists.

Usage in tables

For tables the best option is to directly use the class="nowraplinks" instead of the template {{nowraplinks}}. This also works if you need to use several classes at the same time. Take a look at this table and its code:

Nice, isn't it? I hope people like it. If any one know a better way to do this please tell. I have tested that this works well in IE 5.5, Opera 9.02 and Firefox 2.0.

--David Göthberg 17:27, 10 August 2007 (UTC)

Span vs. div

Have you tested using <div> instead of <span>? I'm not entirely sure, but it may correct some of the problems you've been having with more complicated wrapping cases. --Dinoguy1000 ^Talk 15:01, 22 August 2007 (UTC)

Oh, good idea. I'll test it right away. I did choose span since it allows nowraplinks to even be used on text that wraps around images etc. But I guess it will more or less never be used like that so using div is just as ok to use. --David Göthberg 17:07, 22 August 2007 (UTC)

Ok, I tested more. Same result no matter if I use span, div or a wiki table with the nowraplinks class. Firefox 2.0 keeps wrapping too late so things end up outside the box. And if we add some "(" and ")" around our links, like this (Salt), then both Firefox and IE goes really weird. Firefox then lets things end up way outside the box, and IE starts wrapping wildly between the links and the ")".

Have you seen the discussion we had about this at Template talk:Navbox generic#Class nowraplinks? As I mention there I have found a workaround that seems to work perfectly in all browsers we tested so far. I packaged that solution as {{nowrap begin}}. In many cases it is more complicated to use than nowraplinks, but for instance for dotted lists it is actually as easy to use. And for some complex lists like the one in {{USLegislatures}} it is the easiest solution to use we had so far.

--David Göthberg 17:33, 22 August 2007 (UTC)

Floating over the border problem

I have noticed that the really bad "floating over the right border problem in Firefox and Internet Explorer" occurs when link lists contain any of:

• Parenthesis ( ).
• Quotation marks " ".

So that is the situations when we need to use {{nowrap begin}} + {{·wrap}} + {{nowrap end}} since it solves that problem.

This only happens when a link list uses {{nowraplinks}} or its CSS class. But we use that CSS class in {{navbox}} thus this happens a lot. Note that not using {{nowraplinks}} would mean having to use {{nowrap begin}} + {{·wrap}} + {{nowrap end}} on all link lists which would be more work and more code.

--David Göthberg (talk) 06:32, 26 February 2008 (UTC)

I'm using IE7, and I have never seen this problem. Can you please provide an example of the error so I can see what you mean? --MrStalker ^(talk) 10:32, 26 February 2008 (UTC)

Well, we who know about the problem fix it on sight. So I don't know of any existing examples out there although I stumble on them pretty often. But here are some hand coded examples.

For Firefox the problem usually is that the text and links will flow over the right border of the box. For Internet Explorer the main problem is that it will do line breaks at the parenthesis or quotation marks even if there are no spaces next to those parenthesis or quotation marks.

Note! To see the problem you might have to drag the width of your web browser window so it becomes smaller and smaller.

1: Here is an example using the nowraplinks class:

2: And here is the same example still surrounded by the nowraplinks class but now using the fix {{nowrap begin}} + {{·wrap}} + {{nowrap end}}. As far as we know this example should behave well in all web browsers and not flow out of the box and only line break after the dots.

Remember, this might look different in different versions of Firefox and Internet Explorer. Not all users use the latest web browser version.

--David Göthberg (talk) 10:49, 26 February 2008 (UTC)

Well, at least in IE7 it looks exactly as it should. --MrStalker ^(talk) 12:32, 26 February 2008 (UTC)

Now I have investigated this problem further and documented it properly at the new how-to guide Wikipedia:Line break handling.

--David Göthberg (talk) 14:29, 12 March 2008 (UTC)

Nowrap how-to guide

I first rough version of Wikipedia:Line break handling is done. Its a how-to guide about how to handle word wraps (line breaks) at Wikipedia. Take a look and discuss it on its talk page.

--David Göthberg (talk) 21:38, 11 March 2008 (UTC)

Nowraplinks question for Template:Catholic Prayers

In {{Catholic Prayers}}, the group3 - Other Prayers section does not appear to be nowrapping properly in Firefox 2.0.0.16. Wasn't sure if it was the css class info, that specific template, or just me :) Thx. — MrDolomite • Talk 15:27, 28 July 2008 (UTC)

Yes, this is a known bug in Firefox 2 and we do have a solution: As the documentation for {{nowraplinks}} state: "In some cases link lists that use nowraplinks can behave weird in Firefox and Internet Explorer. Then use {{nowrap begin}} and its helper templates instead."

(I probably should write a better explanation than that some day.)

This is the "Firefox expand outside the box" problem. In your case the links only expands some pixels outside their boxes so mostly a matter of taste if you should fix it or not. I am surprised that you even noticed it in this case. You can learn more about this at Wikipedia:Line break handling#Nowraplinks shortcomings and at its talk page at Wikipedia talk:Line break handling#Firefox bug.

I leave it to you to fix {{Catholic Prayers}}. But feel free to leave a short note on my talk page after you have fixed {{Catholic Prayers}}, then I can take a look at your edit and see if you did it right.

--David Göthberg (talk) 18:03, 2 August 2008 (UTC)