You can use `white-space: nowrap;` to define this behaviour:

    // HTML:
    

&lt;!-- begin snippet: js hide: false --&gt;

&lt;!-- language: lang-css --&gt;

    .nowrap {
      white-space: nowrap ;
    }

&lt;!-- language: lang-html --&gt;

    &lt;p&gt;
          &lt;span class=&quot;nowrap&quot;&gt;How do I wrap this line of text&lt;/span&gt;
          &lt;span class=&quot;nowrap&quot;&gt;- asked by Peter 2 days ago&lt;/span&gt;
        &lt;/p&gt;

&lt;!-- end snippet --&gt;

    
    // CSS:
    .nowrap {
      white-space: nowrap ;
    }

You could also put non-breaking spaces (&amp;ampnbsp;) in lieu of the spaces so that they&#39;re forced to stay together. 

    How do I wrap this line of text
    -&amp;nbsp;asked&amp;nbsp;by&amp;nbsp;Peter&amp;nbsp;2&amp;nbsp;days&amp;nbsp;ago

how can i set a callback for the error handling if mongoose isn&#39;t able to connect to my DB?

i know of
    
    connection.on(&#39;open&#39;, function () { ... });

but is there something like

    connection.on(&#39;error&#39;, function (err) { ... });

?

is there a mongoose connect error callback

I want to get the output from some shell commands like `ls` or `df` in a python script. I see that `commands.getoutput(&#39;ls&#39;)` is deprecated but `subprocess.call(&#39;ls&#39;)` will only get me the return code.

I&#39;ll hope there is some simple solution.

python getoutput() equivalent in subprocess

I&#39;d like to keep a line of text together such that either the whole line drops down a line or none at all

**Acceptable**

    How do I wrap this line of text - asked by Peter 2 days ago

**Acceptable**

    How do I wrap this line of text 
    - asked by Peter 2 days ago

**Not acceptable**

    How do I wrap this line of text - asked by Peter 
    2 days ago


Is this achievable in CSS?

Keep a line of text as a single line - wrap the whole line or none at all

I'd like to keep a line of text together such that either the whole line drops down a line or none at all
Acceptable
<pre><code class="hljs language-arduino">How do I wrap this line of text - asked by Peter 2 days ago
</code></pre>
Acceptable
<pre><code class="hljs language-arduino">How do I wrap this line of text 
- asked by Peter 2 days ago
</code></pre>
Not acceptable
<pre><code class="hljs language-arduino">How do I wrap this line of text - asked by Peter 
2 days ago
</code></pre>
Is this achievable in CSS?

&gt; **Possible Duplicate:**  
&gt; [Truncate leading zeros of a string in Javascript](https://stackoverflow.com/questions/594325/truncate-leading-zeros-of-a-string-in-javascript)  

&lt;!-- End of automatically inserted text --&gt;

What is the simplest and cross-browser compatible way to remove leading zeros from a number in Javascript ?

e.g. If I have a textbox value as 014 or 065, it should only return 14 or 65

Remove leading zeros from a number in Javascript

When I was studying the `overflow` property&#39;s values, I came across these two values: `auto` and `scroll`, which adds scrollbar(s) if the content overflows the element. 

Could someone please explain me whats the difference between them?

Difference between HTML &quot;overflow : auto&quot; and &quot;overflow : scroll&quot;

I&#39;m trying to send a multipart/related html email with embedded gif images.  This email is generated using Oracle PL/SQL.  My attempts have failed, with the image showing up as a red X (in Outlook 2007 and yahoo mail)

I&#39;ve been sending html emails for some time, but my requirements are now to use several gif images in the email.  I can store these on one of our web servers and just link to them, but many users email clients will not show them automatically and will need to either change settings or manually download them for each email.

So, my thoughts are to embed the image.  My questions are:

1.  What am I doing wrong here?
2.  Is the embedding approach the correct one?
3.  Any other options if I need to use more and more images?  Attachments won&#39;t work, as the images are typically logos and icons that won&#39;t make sense out of the context of the message.  Also, some elements of the email are links into an online system, so generating a static PDF and attaching won&#39;t work (to my knowledge anyway).
 
snippet:

    MIME-Version: 1.0
    To: me@gmail.com
    BCC: me@yahoo.com
    From: email@yahoo.com
    Subject: Test
    Reply-To: email@yahoo.com
    Content-Type: multipart/related; boundary=&quot;a1b2c3d4e3f2g1&quot;
    
    --a1b2c3d4e3f2g1
    
    content-type: text/html;
    
        &lt;html&gt;
        &lt;head&gt;&lt;title&gt;My title&lt;/title&gt;&lt;/head&gt;
        &lt;body&gt;
        &lt;div style=&quot;font-size:11pt;font-family:Calibri;&quot;&gt;
        &lt;p&gt;&lt;IMG SRC=&quot;cid:my_logo&quot; alt=&quot;Logo&quot;&gt;&lt;/p&gt;
    
    ... more html here ...
    
    &lt;/div&gt;&lt;/body&gt;&lt;/html&gt; 
    
    --a1b2c3d4e3f2g1
    
    Content-Type: image/gif;
    Content-ID:&lt;my_logo&gt;
    Content-Transfer-Encoding: base64
    Content-Disposition: inline
    
    [base64 image data here]
    
    --a1b2c3d4e3f2g1--



Many thanks.

BTW: Yes, I have verified that the base64 data is correct, as I can embed the image in the html itself (using same algo use for creating header data) and see image in Firefox/IE.

I should also note that this is NOT for spam, the emails are sent to specific clients who are expecting it daily.  The content is data-driven, and not adverts.

embedding image in html email

HTML5 has a new global attribute, `hidden`, which can be used to hide content.   

&lt;!-- language: lang-html --&gt;

    &lt;article hidden&gt;
       &lt;h2&gt;Article #1&lt;/h2&gt;
       &lt;p&gt;Lorem ipsum ...&lt;/p&gt;
    &lt;/article&gt;

CSS has the `display:none` rule, which can also be used to hide content. 

    article { display:none; }

Visually, they are identical.  What is the difference semantically?  Computationally?

What guidelines should I consider on when to use one or the other?

TIA.

**EDIT**:  Based on @newtron&#39;s responses (below), I did more searching.  The `hidden` attribute was hotly contested last year and (apparently) barely made it into the HTML5 spec.  Some argued it was redundant and had no purpose.  From what I can tell, the final evaluation is this:  If I&#39;m targeting only web browsers, there is no difference.  (One page even asserted that web browsers used `display:none` to implement the hidden attribute.)  But if I&#39;m considering accessibility (e.g., perhaps I expect my content to be read by screen-readers), then there is a difference.  The CSS rule `display:none` might hide my content from web browsers, but a corresponding aria rule (e.g., `aria-hidden=&quot;false&quot;`) might try to read it.  Thus, I now agree that @newtron&#39;s answer is correct, though perhaps (arguably) not as clear as I might like.  Thanks @newtron for your help.

What is the difference between the hidden attribute (HTML5) and the display:none rule (CSS)?

OK, what am I missing?
I have:

    &lt;form&gt;
    	&lt;input type=&quot;checkbox&quot; name=&quot;showRatings&quot; value=&quot;1&quot; checked&gt;
    	&lt;label for=&quot;showRatings&quot;&gt;Show Ratings&lt;/label&gt;
    &lt;/form&gt;

And when I click on the &quot;Show Ratings&quot; text, the checkbox is not toggling.
I know it&#39;s something simple.



label not working with checkbox

I have a CSS class `Modal` which is absolutely positioned, z-indexed above it&#39;s parent, and nicely positioned with JQuery.  I want to add a caret image (^) to the top of the modal box and was looking at using the `:before` CSS pseudo selector to do this cleanly.  

The image needs to be absolutely positioned and z-indexed above the modal, but I haven&#39;t found any way to add the appropriate class to the image in the `content` attribute:

    .Modal:before{
      content:url(&#39;blackCarrot.png&#39;) /* with class ModalCarrot ??*/
    }

    .ModalCarrot{
       position:absolute;
       left:50%;
       margin-left:-8px;
       top:-16px;
    }
    
Second best option- can I add the styles inline in the content attribute?

Using :before CSS pseudo element to add image to modal

I have an input field, and the color of the text in it is black. (I&#39;m using jquery.placeholder) Let&#39;s say the text in there is &quot;E-Mail&quot;

When you click on this field, the black placeholding text dissapears (thanks to jquery.placeholder).

Any text inputted into this field, I want it to turn red, and when you deselect this field, I want it to stay red.

At the moment, the text saying &quot;E-Mail&quot; is black, and anything I type into is red, which is great, but as soon as i deselect, it goes back to black. Can anyone help me? I want the text to stay red, even after it&#39;s deselected. Here is my code

    textarea:focus, input:focus {
    	color: #ff0000;
    }

    input, select, textarea{
    	color: #000;
    }

CSS Input field text color of inputted text

This question [was asked before][1] but the solution is not applicable in my case. I want to make sure certain background images are printed because they are integral to the page. (They are not images directly in the page because there are several of them being used as CSS sprites.)

Another solution on that same question suggests using `list-style-image`, which only works if you have a different image for every icon, no CSS sprites possible.

Aside from creating a separate page with the icons inline, is there another solution?


  [1]: https://stackoverflow.com/questions/596876/how-can-i-print-background-images-in-ff-or-ie

How can I force browsers to print background images in CSS?

I cannot find any examples of how to do this, but how can I add a box shadow only to the top and bottom of an element?

CSS Box Shadow - Top and Bottom Only

I have a hex color, e.g. `#F4F8FB` (or `rgb(244, 248, 251)`) that I want converted into an _as-transparent-as-possible_ rgba color (when displayed over white).  Make sense?  I&#39;m looking for an algorithm, or at least idea of an algorithm for how to do so.

For Example:

    rgb( 128, 128, 255 ) --&gt; rgba(   0,   0, 255,  .5 )
    rgb( 152, 177, 202 ) --&gt; rgba(  50, 100, 150,  .5 ) // can be better(lower alpha)


Ideas?

---

FYI solution based on Guffa&#39;s answer:

&lt;!-- language: lang-js --&gt;

    function RGBtoRGBA(r, g, b){
        if((g == null) &amp;&amp; (typeof r === &#39;string&#39;)){
            var hex = r.replace(/^\s*#|\s*$/g, &#39;&#39;);
            if(hex.length === 3){
                hex = hex.replace(/(.)/g, &#39;$1$1&#39;);
            }
            r = parseInt(hex.substr(0, 2), 16);
            g = parseInt(hex.substr(2, 2), 16);
            b = parseInt(hex.substr(4, 2), 16);
        }
    
        var min, a = (255 - (min = Math.min(r, g, b))) / 255;
    
        return {
            r    : r = 0|(r - min) / a,
            g    : g = 0|(g - min) / a,
            b    : b = 0|(b - min) / a,
            a    : a = (0|1000*a)/1000,
            rgba : &#39;rgba(&#39; + r + &#39;, &#39; + g + &#39;, &#39; + b + &#39;, &#39; + a + &#39;)&#39;
        };
    }

    RGBtoRGBA(204, 153, 102) == RGBtoRGBA(&#39;#CC9966&#39;) == RGBtoRGBA(&#39;C96&#39;) == 
        {
           r    : 170,
           g    : 85 ,
           b    : 0  ,
           a    : 0.6,
           rgba : &#39;rgba(170, 85, 0, 0.6)&#39; 
        }

Content Type	Original Author	Original Content on Stackoverflow
Question	Peter Nixey	View Question on Stackoverflow
Solution 1 - Html	Gus	View Answer on Stackoverflow
Solution 2 - Html	substate	View Answer on Stackoverflow

Keep a line of text as a single line - wrap the whole line or none at all

Html Problem Overview

Html Solutions

Solution 1 - Html

Solution 2 - Html

python getoutput() equivalent in subprocess

is there a mongoose connect error callback

Attributions