<?xml version="1.0" encoding="UTF-8"?><rss
version="2.0"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:atom="http://www.w3.org/2005/Atom"
xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
> <channel><title>Comments on: Preventing Widows in Post&#160;Titles</title> <atom:link href="http://css-tricks.com/preventing-widows-in-post-titles/feed/" rel="self" type="application/rss+xml" /><link>http://css-tricks.com/preventing-widows-in-post-titles/</link> <description>Tips, Tricks, and Techniques on using Cascading Style Sheets.</description> <lastBuildDate>Fri, 10 Sep 2010 23:41:07 +0000</lastBuildDate> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <generator>http://wordpress.org/?v=3.0.1</generator> <item><title>By: Josh</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-63539</link> <dc:creator>Josh</dc:creator> <pubDate>Mon, 26 Oct 2009 17:48:48 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-63539</guid> <description>For some reason I can&#039;t get this to work and it&#039;s super frustrating. I can&#039;t seem to figure out what I&#039;m doing wrong. Can anybody see the error of my ways? http://gigabetz.com/jquery-test.php</description> <content:encoded><![CDATA[<p>For some reason I can&#8217;t get this to work and it&#8217;s super frustrating. I can&#8217;t seem to figure out what I&#8217;m doing wrong. Can anybody see the error of my ways? <a
href="http://gigabetz.com/jquery-test.php" rel="nofollow">http://gigabetz.com/jquery-test.php</a></p> ]]></content:encoded> </item> <item><title>By: Greg</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-61499</link> <dc:creator>Greg</dc:creator> <pubDate>Tue, 15 Sep 2009 13:11:01 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-61499</guid> <description>Just a simple suggestion:
Instead of writing this
&lt;code&gt;
wordArray[wordArray.length-2] += &quot;&#160;&quot; + wordArray[wordArray.length-1];
wordArray.pop();
&lt;/code&gt;
try this
&lt;code&gt;
wordArray[wordArray.length-2] += &quot;&#160;&quot; + wordArray.pop();
&lt;/code&gt;
the pop method removes the last element AND returns it  so you can do both with just the one line.</description> <content:encoded><![CDATA[<p>Just a simple suggestion:<br
/> Instead of writing this<br
/> <code><br
/> wordArray[wordArray.length-2] += "&nbsp;" + wordArray[wordArray.length-1];<br
/> wordArray.pop();<br
/> </code><br
/> try this<br
/> <code><br
/> wordArray[wordArray.length-2] += "&nbsp;" + wordArray.pop();<br
/> </code><br
/> the pop method removes the last element AND returns it  so you can do both with just the one line.</p> ]]></content:encoded> </item> <item><title>By: Skilldrick</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-61234</link> <dc:creator>Skilldrick</dc:creator> <pubDate>Thu, 10 Sep 2009 10:30:21 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-61234</guid> <description>I work in book production, and we call a the first line of a paragraph on its own at the end of a column/paragraph an orphan, and the last line of a paragraph at the beginning of a paragraph a widow.A single word on the last line of a paragraph would usually be called a paragraph widow, but (note that I am using paragraph to cover any separate unit of text, e.g. headings, list items etc.).</description> <content:encoded><![CDATA[<p>I work in book production, and we call a the first line of a paragraph on its own at the end of a column/paragraph an orphan, and the last line of a paragraph at the beginning of a paragraph a widow.</p><p>A single word on the last line of a paragraph would usually be called a paragraph widow, but (note that I am using paragraph to cover any separate unit of text, e.g. headings, list items etc.).</p> ]]></content:encoded> </item> <item><title>By: Ben</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-60868</link> <dc:creator>Ben</dc:creator> <pubDate>Fri, 04 Sep 2009 17:21:24 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-60868</guid> <description>Sure.Extending my example below:&lt;pre&gt;&lt;code&gt;var headings = document.getElementsByTagName(&quot;h1&quot;);
for (var i=0;i&lt;headings.length;i++)
{
var h1s = headings[i].innerHTML.split(&quot; &quot;);
len = h1s[h1s.length-2] + h1s[h1s.length-1];
if (len.length &lt;= 20)
{
h1s[h1s.length-2] += &quot;&#160;&quot; + h1s[h1s.length-1];
h1s.pop();
headings[i].innerHTML = h1s.join(&quot; &quot;);
}
}&lt;/code&gt;&lt;/pre&gt;It&#039;s set to 20 characters but you could set it lower or higher for your requirements - the script won&#039;t run if it&#039;s higher than 20. :-)</description> <content:encoded><![CDATA[<p>Sure.</p><p>Extending my example below:</p><pre><code>var headings = document.getElementsByTagName("h1");
	for (var i=0;i&lt;headings.length;i++)
	{
		var h1s = headings[i].innerHTML.split(&quot; &quot;);
        len = h1s[h1s.length-2] + h1s[h1s.length-1];
        if (len.length &lt;= 20)
        {
        	h1s[h1s.length-2] += &quot;&nbsp;&quot; + h1s[h1s.length-1];
       		h1s.pop();
        	headings[i].innerHTML = h1s.join(&quot; &quot;);
        }
	}</code></pre><p>It&#8217;s set to 20 characters but you could set it lower or higher for your requirements &#8211; the script won&#8217;t run if it&#8217;s higher than 20. :-)</p> ]]></content:encoded> </item> <item><title>By: Ben</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-60865</link> <dc:creator>Ben</dc:creator> <pubDate>Fri, 04 Sep 2009 16:59:03 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-60865</guid> <description>Or for those who are old school and don&#039;t require a large JS library:&lt;code&gt;
var headings = document.getElementsByTagName(&quot;h1&quot;);
for (var i=0;i&lt;headings.length;i++)
{
var h1s = headings[i].innerHTML.split(&quot; &quot;);
h1s[h1s.length-2] += &quot;&nbsp;&quot; + h1s[h1s.length-1];
h1s.pop();
headings[i].innerHTML = h1s.join(&quot; &quot;);
}
&lt;/code&gt;This example uses h1 but you can easily substitute that for another one. :-)</description> <content:encoded><![CDATA[<p>Or for those who are old school and don&#8217;t require a large JS library:</p><p><code><br
/> var headings = document.getElementsByTagName("h1");<br
/> for (var i=0;i&lt;headings.length;i++)<br
/> {<br
/> var h1s = headings[i].innerHTML.split(&quot; &quot;);<br
/> h1s[h1s.length-2] += &quot;&amp;nbsp;&quot; + h1s[h1s.length-1];<br
/> h1s.pop();<br
/> headings[i].innerHTML = h1s.join(&quot; &quot;);<br
/> }<br
/> </code></p><p>This example uses h1 but you can easily substitute that for another one. :-)</p> ]]></content:encoded> </item> <item><title>By: ehdv</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-60478</link> <dc:creator>ehdv</dc:creator> <pubDate>Wed, 02 Sep 2009 23:03:59 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-60478</guid> <description>What&#039;s wrong with the &lt;nobr&gt; html tag?</description> <content:encoded><![CDATA[<p>What&#8217;s wrong with the &lt;nobr&gt; html tag?</p> ]]></content:encoded> </item> <item><title>By: Josh N.</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-60467</link> <dc:creator>Josh N.</dc:creator> <pubDate>Wed, 02 Sep 2009 20:30:14 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-60467</guid> <description>Could we also throw an if statement in there to check the length of the last word? If it&#039;s more than a certain character length don&#039;t add the no-break space? Sometimes the last word is really long and adding a no-break space would cause an orphan instead.I&#039;ve run into this problem with sites that deal with a lot of scientific terminology.</description> <content:encoded><![CDATA[<p>Could we also throw an if statement in there to check the length of the last word? If it&#8217;s more than a certain character length don&#8217;t add the no-break space? Sometimes the last word is really long and adding a no-break space would cause an orphan instead.</p><p>I&#8217;ve run into this problem with sites that deal with a lot of scientific terminology.</p> ]]></content:encoded> </item> <item><title>By: Rembrand</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-60392</link> <dc:creator>Rembrand</dc:creator> <pubDate>Wed, 02 Sep 2009 11:44:05 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-60392</guid> <description>Are you Dutch by any chance? There&#039;s such great/strange/funny words associated with typography in Dutch. Like swearing words. My favourites are probably &#039;hoerenjong&#039; and &#039;weeskind&#039;. Cracks me up every time.</description> <content:encoded><![CDATA[<p>Are you Dutch by any chance? There&#8217;s such great/strange/funny words associated with typography in Dutch. Like swearing words. My favourites are probably &#8216;hoerenjong&#8217; and &#8216;weeskind&#8217;. Cracks me up every time.</p> ]]></content:encoded> </item> <item><title>By: Alexander</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-60363</link> <dc:creator>Alexander</dc:creator> <pubDate>Tue, 01 Sep 2009 16:56:15 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-60363</guid> <description>To avoid this I would usually just have short titles and use &lt;code&gt;white-space:nowrap;&lt;/code&gt;, and of course - leave enough space for the title.Additionally, you could just substitute the non-breaking space between the last two words with wrapping them in an inline element/tag that has that &lt;code&gt;white-space:nowrap;&lt;/code&gt; I mentioned, instead of the whole title. I find it cheaper and more fail-proof, in case an user-agent happens to have JS disabled.</description> <content:encoded><![CDATA[<p>To avoid this I would usually just have short titles and use <code>white-space:nowrap;</code>, and of course &#8211; leave enough space for the title.</p><p>Additionally, you could just substitute the non-breaking space between the last two words with wrapping them in an inline element/tag that has that <code>white-space:nowrap;</code> I mentioned, instead of the whole title. I find it cheaper and more fail-proof, in case an user-agent happens to have JS disabled.</p> ]]></content:encoded> </item> <item><title>By: kaballah</title><link>http://css-tricks.com/preventing-widows-in-post-titles/#comment-60350</link> <dc:creator>kaballah</dc:creator> <pubDate>Tue, 01 Sep 2009 14:07:57 +0000</pubDate> <guid
isPermaLink="false">http://css-tricks.com/?p=3563#comment-60350</guid> <description>Well, and what further?</description> <content:encoded><![CDATA[<p>Well, and what further?</p> ]]></content:encoded> </item> </channel> </rss>
<!-- This site's performance optimized by W3 Total Cache. Dramatically improve the speed and reliability of your blog!

Learn more about our WordPress Plugins: http://www.w3-edge.com/wordpress-plugins/

Minified using disk
Page Caching using disk (enhanced) (user agent is rejected)
Database Caching 3/9 queries in 0.019 seconds using apc
Content Delivery Network via cdn.css-tricks.com

Served from: css-tricks.com @ 2010-09-10 23:53:09 -->