For compatibility with all browsers stick with `.ico`.

.png is getting more and more support though as it is easier to create using multiple programs.

for .ico 

    &lt;link rel=&quot;shortcut icon&quot; href=&quot;http://example.com/myicon.ico&quot; /&gt;

for .png, you need to specify the type

    &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; href=&quot;http://example.com/image.png&quot; /&gt;

See here: [Cross Browser favicon][1]

Thats the way to go:

    &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; href=&quot;http://www.example.com/image.png&quot;&gt;&lt;!-- Major Browsers --&gt;
    &lt;!--[if IE]&gt;&lt;link rel=&quot;SHORTCUT ICON&quot; href=&quot;http://www.example.com/alternateimage.ico&quot;/&gt;&lt;![endif]--&gt;&lt;!-- Internet Explorer--&gt;


  [1]: http://www.kevinleary.net/how-to-add-cross-browser-favicon-website/

I know this is an old question.

Here&#39;s another option - attending to different platform requirements - [Source][1]

    &lt;link rel=&#39;shortcut icon&#39; type=&#39;image/vnd.microsoft.icon&#39; href=&#39;/favicon.ico&#39;&gt; &lt;!-- IE --&gt;
    &lt;link rel=&#39;apple-touch-icon&#39; type=&#39;image/png&#39; href=&#39;/icon.57.png&#39;&gt; &lt;!-- iPhone --&gt;
    &lt;link rel=&#39;apple-touch-icon&#39; type=&#39;image/png&#39; sizes=&#39;72x72&#39; href=&#39;/icon.72.png&#39;&gt; &lt;!-- iPad --&gt;
    &lt;link rel=&#39;apple-touch-icon&#39; type=&#39;image/png&#39; sizes=&#39;114x114&#39; href=&#39;/icon.114.png&#39;&gt; &lt;!-- iPhone4 --&gt;
    &lt;link rel=&#39;icon&#39; type=&#39;image/png&#39; href=&#39;/icon.114.png&#39;&gt; &lt;!-- Opera Speed Dial, at least 144&#215;114 px --&gt;

This is the broadest approach I have found so far.

Ultimately the decision depends on your own needs. Ask yourself, who is your target audience?

**UPDATE May 27, 2018:** As expected, time goes by and things change. But there&#39;s good news too. I found a tool called [Real Favicon Generator][2] that generates all the required lines for the icon to work on all modern browsers and platforms. It doesn&#39;t handle backwards compatibility though.


  [1]: https://stackoverflow.com/questions/13049636/adding-apple-icon-to-website
  [2]: https://realfavicongenerator.net/

I ported my Android app to honeycomb and I did a big refactor in order to use fragments. In my previous version, when I pressed the Home button I used to do a `ACTIVITY_CLEAR_TOP` in order to reset the back stack. 

Now my app is just a single Activity with multiple fragments, so when I press the Home button I just replace one of the fragments inside it. How can I clear my back stack without having to use `startActivity` with the `ACTIVITY_CLEAR_TOP` flag? 

Clear back stack using fragments

I have a bunch of product orders and I&#39;m trying to group by the date and sum the quantity for that date. How can I group by the month/day/year without taking the time part into consideration?

`3/8/2010 7:42:00` should be grouped with `3/8/2010 4:15:00`



How can I group by date time column without taking time into consideration

In a HTML5 document, which favicon format do you recommend and why? I want it to be supported by IE7 and all the modern browsers.

Also, when using .png, do I need to specify the type (type=&quot;image/png&quot;)?
    &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; href=&quot;image.png&quot; /&gt;

Favicon: .ico or .png / correct tags?

<p>In a HTML5 document, which favicon format do you recommend and why? I want it to be supported by IE7 and all the modern browsers.</p>
<p>Also, when using .png, do I need to specify the type (type="image/png")?
<link rel="icon" type="image/png" href="image.png"></p>


How to add title=&#39;mandatory&#39; from css to the following


         &lt;label class=&#39;mandatory&#39;&gt;Name&lt;/label&gt;

    .mandatory
    {
    background-image:url(/media/img/required.gif);
    background-position:top right;
    background-repeat:no-repeat;
    padding-right:10px;
    font-weight:bold;
    }


add title attribute from css

I&#39;ve always been unsure of where to start as a general best practice baseline. Yes, I know it depends on your design, but what&#39;s most common?

Here&#39;s what I currently have as a starter:


    h1 { font-size: 24px;}
    h2 { font-size: 22px;}
    h3 { font-size: 18px;}
    h4 { font-size: 16px;}
    h5 { font-size: 12px;}
    h6 { font-size: 10px;}


Yes, we don&#39;t use EMs at my current job.

What are the most common font-sizes for H1-H6 tags

I would like a textarea that handles a situation of pressing *tab* key.

In default case if you press a *tab* key then focus leaves the textarea. But what about the situation when user wants to type *tab* key in textarea?

Can I catch this event and return focus to the textarea and add a tab to a *current* cursor position?

How to handle &lt;tab&gt; in textarea?

I am using [lxml.html][1] to generate some HTML. I want to pretty print (with indentation) my final result into an html file. How do I do that?

This is what I have tried and got till now
    

    import lxml.html as lh
    from lxml.html import builder as E
    sliderRoot=lh.Element(&quot;div&quot;, E.CLASS(&quot;scroll&quot;), style=&quot;overflow-x: hidden; overflow-y: hidden;&quot;)
    scrollContainer=lh.Element(&quot;div&quot;, E.CLASS(&quot;scrollContainer&quot;), style=&quot;width: 4340px;&quot;)
    sliderRoot.append(scrollContainer)
    print lh.tostring(sliderRoot, pretty_print = True, method=&quot;html&quot;)

As you can see I am using the `pretty_print=True` attribute. I thought that would give indented code, but it doesn&#39;t really help. This is the output :

`&lt;div style=&quot;overflow-x: hidden; overflow-y: hidden;&quot; class=&quot;scroll&quot;&gt;&lt;div style=&quot;width: 4340px;&quot; class=&quot;scrollContainer&quot;&gt;&lt;/div&gt;&lt;/div&gt;`


  [1]: http://lxml.de/lxmlhtml.html

How to Pretty Print HTML to a file, with indentation

I am looking for a Javascript autocomplete implementation which includes the following:

* Can be used in a HTML textarea
* Allows for typing regular text without invoking autocomplete
* Detects the `@` character and starts autocomplete when it is typed
* Loads list of options through AJAX

I believe that this is similar to what Twitter is doing when tagging in a tweet, but I can&#39;t find a nice, reusable implementation.  
A solution with jQuery would be perfect.

Thanks.

Twitter-style autocomplete in textarea

Given a transparent PNG displaying a simple shape in white, is it possible to somehow change the color of this through CSS? Some kind of overlay or what not?


Change color of PNG image via CSS?

I have stacked into the question: I need to plot the image with DPI=1200 and specific print size.

By default the png looks ok...
![enter image description here][1]

    png(&quot;test.png&quot;,width=3.25,height=3.25,units=&quot;in&quot;,res=1200)
    par(mar=c(5,5,2,2),xaxs = &quot;i&quot;,yaxs = &quot;i&quot;,cex.axis=1.3,cex.lab=1.4)
    plot(perf,avg=&quot;vertical&quot;,spread.estimate=&quot;stddev&quot;,col=&quot;black&quot;,lty=3, lwd=3)
    dev.off()

But when I apply this code, the image became really terrible it&#39;s not scaling (fit) to the size that is needed. What did I miss? How to &quot;fit&quot; the image to the plot?

 ![enter image description here][2],

 


  [1]: http://i.stack.imgur.com/v51Aj.png
  [2]: http://i.stack.imgur.com/sueTP.png

R plot: size and resolution

I am currently working on an application that requires high-performance conversion of an unpadded byte array to either a PNG or JPEG. The image format doesn&#39;t matter, just as long as it&#39;s fast.

I have tried the .NET libraries and the performance is very bad. Can anyone recommend a good freeware library for this?

EDIT: the byte[] is an 8bit grayscale bitmap

Converting a byte array to PNG/JPG

When I click on an image link right now, Chrome downloads the image instead of opening it. 

Even if I right-click and select `Open link in new tab` Chrome *still* downloads the image, and I have to go through the extra steps of opening the file for viewing manually.

This feels like a mime-type issue to me, but why would Chrome not recognize &quot;image/png&quot; as a valid mime-type for viewing? All PNG images display just fine in an HTML page.

NOTE: This only happens for PNG images.

Chrome downloads PNG image links. I want them to open for viewing in a new tab. How do I make Chrome do that?

I found JPG does not support transparency, the alpha value is always 255. I am wondering only png supports transparency?

Only PNG supports transparency, is that true?

I didn&#39;t include the following line of code in my head tag, however my favicon still appears in my browser:

    &lt;link rel=&quot;icon&quot; href=&quot;favicon.ico&quot; type=&quot;image/x-icon&quot; /&gt;

What&#39;s the purpose of including it?

Do you have to include &lt;link rel=&quot;icon&quot; href=&quot;favicon.ico&quot; type=&quot;image/x-icon&quot; /&gt;?

I *DO* know this question has been asked at least a thousand times in this website alone, but I HAVE read many of those threads, I DO consider myself very knowledgeable and rarely ever ask anything, instead prefer to do my own research.

However, THIS issue is so strange, without hope for real enlightenment (since this question HAS been discussed so often and still I could not benefit from reading there), here is my issue:

favicon.ico exists, and (locally hosted development website) `http://website/favicon.ico` displays the correct icon. Its size is a mere 198 Bytes, so the size limit I found in Firefox&#39;s about:config of 1024 Bytes is adhered to. According to the wisdom on favicons on the web the browser should ask for favicons on its own when there is nothing in the &lt;head&gt; of the page. However, my apache log clearly shows Firefox (9.01) never even asks for it.

Next: when I add 

    &lt;link rel=&quot;shortcut icon&quot; href=&quot;/favicon.ico&quot;&gt;

I still don&#39;t get a favicon.

Next: when I instead use

    &lt;link rel=&quot;shortcut icon&quot; href=&quot;/favicon.ico?&quot;&gt;

(note the trailing &quot;?&quot;) I suddenly *DO* get a favicon. BUt it cannot be a cache issue! First, I have cleared the cache, second, as I mentioned above, I already successfully loaded the icon file into Firefox through its URL `http://website/favicon.ico`

I am unable to explain this behavior of Firefox. Chrome shows the correct favicon, by the way.

This is my page head:

    &lt;!doctype html&gt;
    &lt;html&gt;
    &lt;head&gt;
    	&lt;meta charset=&quot;utf-8&quot;&gt;
        &lt;link rel=&quot;shortcut icon&quot; href=&quot;/favicon.ico?&quot; /&gt;
    &lt;/head&gt;
    ...
As soon as I append at least the &quot;?&quot; after &quot;ico&quot; it works.

Here is what the server sends when the icon is requested, since some have asked for this. **I have no idea why this would be useful, since a) I said my cache was empty for each test (checked with about:cache too), and b) I said the server is never even asked for the file when it does not show up.** Firefox just does not ask without the &quot;?&quot; - with cache empty! The request shows up in the apache log ONLY when I use the appended &quot;?&quot;.

    Date	Fri, 23 Dec 2011 12:53:22 GMT
    Server	Apache/2.2.20 (Ubuntu)
    Last-Modified	Fri, 23 Dec 2011 12:02:49 GMT
    Etag	&quot;12c07fe-c6-4b4c132190e30&quot;
    Accept-Ranges	bytes
    Content-Length	198
    Content-Type	image/x-icon

favicon not displayed by Firefox

I want to set the favicon for a fairly large number of pages. But, instead of using the HTML `&lt;head&gt;` tag `&lt;link rel=&quot;shortcut icon&quot; href=&quot;favicon.ico&quot;&gt;`, I&#39;d like to set it in the CSS file. I have limited access to some of the html files, and limited control to their life cycle.

using favicon with css

I know new rails apps come with an empty favicon.ico file.  I want to know how I go about adding a favicon.  I know you can use the `favicon_link_tag` helper, but I am not sure how to populate the favicon.ico file.  Do you use favicon generators?  If so, which one is best?

I also want to be able to cache it, does rails do that automatically as well?

Thanks

How to add favicon in rails 3.2

I have a few static pages that are just pure HTML, that we display when the server goes down. How can I put a favicon that I made (it&#39;s 16x16px and it&#39;s sitting in the same directory as the HTML file; it&#39;s called favicon.ico) as the &quot;tab&quot; icon as it were? I have read up on Wikipedia and looked at a few tutorials and have implemented the following:

    &lt;link rel=&quot;icon&quot; href=&quot;favicon.ico&quot; type=&quot;image/x-icon&quot;/&gt;
    &lt;link rel=&quot;shortcut icon&quot; href=&quot;favicon.ico&quot; type=&quot;image/x-icon&quot;/&gt;

But it still doesn&#39;t want to work. I am using Chrome to test the sites. According to Wikipedia .ico is the best picture format that runs on all browser types.

## Update

I could not get this to work locally although the code checks out it will only really work properly once the server started serving the site. Just try pushing it up to the server and refresh your cache and it should work fine.

Content Type	Original Author	Original Content on Stackoverflow
Question	Richard	View Question on Stackoverflow
Solution 1 - Html	Ibu	View Answer on Stackoverflow
Solution 2 - Html	rudimenter	View Answer on Stackoverflow
Solution 3 - Html	537mfb	View Answer on Stackoverflow

Favicon: .ico or .png / correct tags?

Html Problem Overview

Html Solutions

Solution 1 - Html

Solution 2 - Html

Solution 3 - Html

How can I group by date time column without taking time into consideration

Clear back stack using fragments

Attributions