It&#39;s only useful for very tiny images. Base64 encoded files are larger than the original. The advantage lies in not having to open another connection and make a HTTP request to the server for the image. This benefit is lost very quickly so there&#39;s only an advantage for large numbers of very tiny individual images.

&gt; the actual length of MIME-compliant Base64-encoded binary data is
&gt; usually about 137% of the original data length, though for very short
&gt; messages the overhead can be much higher due to the overhead of the
&gt; headers. Very roughly, the final size of Base64-encoded binary data is
&gt; equal to 1.37 times the original data size + 814 bytes (for headers).
&gt;
&gt; In other words, the size of the decoded data can be approximated with this formula:

    bytes = (string_length(encoded_string) - 814) / 1.37

Source: http://en.wikipedia.org/wiki/Base64#MIME

Some of downsides as below are already mentioned in this post at https://stackoverflow.com/questions/1574961/how-much-faster-is-it-to-use-inline-base64-images-for-a-web-site-than-just-linki 

 - Most forms of caching are beaten which could hurt a lot if the image is viewed often - say, a logo that is displayed on every page, which could normally be cached by the browser.
 - More CPU usage.

also the response time of the HTML page will increase, because images loads asyn in normal scenario. even if images loads late you can start seeing text.


Another advantage of CDN would lost if only media is being cached in CDN

that advantage will be lost.

I found myself confused with the `array` and `slice` data types.

From Go docs, arrays are described as follows:

&gt; There are major differences between the ways arrays work in Go and C. In Go,
&gt;
&gt; - Arrays are values. Assigning one array to another copies all the elements.
&gt; - In particular, if you pass an array to a function, it will receive a copy of the array, not a pointer to it.
&gt; - The size of an array is part of its type. The types [10]int and [20]int are distinct.

Functions:

&gt; As in all languages in the C family, everything in Go is passed by
&gt; value. That is, a function always gets a copy of the thing being
&gt; passed, as if there were an assignment statement assigning the value
&gt; to the parameter. For instance, passing an int value to a function
&gt; makes a copy of the int, and passing a pointer value makes a copy of
&gt; the pointer, but not the data it points to.

Why does `sort.Ints(arrayValue)` modify the passed variable when I declared it as an array, not as a slice?

Code

    var av = []int{1,5,2,3,7}
      
    fmt.Println(av)
    sort.Ints(av)
    fmt.Println(av)
    return

Output

    [1 5 2 3 7]
    [1 2 3 5 7]

Array and slice data types

I&#39;m defining a custom Exception on a model in rails as kind of a wrapper Exception: (`begin[code]rescue[raise custom exception]end`)

When I raise the Exception, I&#39;d like to pass it some info about a) the instance of the model whose internal functions raise the error, and b) the error that was caught.

This is going on an automated import method of a model that gets populated by POST request to from foreign datasource.

tldr; How can one pass arguments to an Exception, given that you define the Exception yourself? I have an initialize method on that Exception but the `raise` syntax seems to only accept an Exception class and message, no optional parameters that get passed into the instantiation process.

Raise custom Exception with arguments

I am thinking of using base64 encoded images for a site I am working on to optimize the load time.

Anyways, before I start, I was wondering: what are the advantages and disadvantages of doing this?

At the moment, I don&#39;t see any disadvantage but also I noticed that it is not a technique used very often and that makes me wonder if I didn&#39;t miss something.

After googleing the subject I didn&#39;t find anything clear so I decided to ask here.

Advantages and disadvantages of using base64 encoded images

I am thinking of using base64 encoded images for a site I am working on to optimize the load time.
Anyways, before I start, I was wondering: what are the advantages and disadvantages of doing this?
At the moment, I don't see any disadvantage but also I noticed that it is not a technique used very often and that makes me wonder if I didn't miss something.
After googleing the subject I didn't find anything clear so I decided to ask here.

On my website I use reset.css. It adds exactly this to list styles:

    ol, ul {
        list-style: none outside none;
    }
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
        background: none repeat scroll 0 0 transparent;
        border: 0 none;
        font-size: 100%;
        margin: 0;
        outline: 0 none;
        padding: 0;
        vertical-align: baseline;
    }

The problem is that all list styles are set to `NONE` with this. I want to revert back original list styles (default) for all lists on website sub-pages only (all lists in `.my_container`).

When I try settings things like `list-style-type` to `inherit` is doesn&#39;t inherit the browser&#39;s default styles just for this CSS property.

**Is there any way to inherit the original browser&#39;s styles for certain properties without modifying reset.css?**

What is default list styling (CSS)?

[The HTML5 documentation recommends][1] putting the `code` element inside the `pre` element, but I don&#39;t understand how this is better or more semantic than just using the code element and CSS. In their own example:

    &lt;pre&gt;&lt;code class=&quot;language-pascal&quot;&gt;var i: Integer;
    begin
       i := 1;
    end.&lt;/code&gt;&lt;/pre&gt;

Could also be written (Making some assumptions about the browser&#39;s defaults for `pre`):

    &lt;style&gt;
    code {
        display: block;
        white-space: pre;
    }
    &lt;/style&gt;
    …
    &lt;code class=&quot;language-pascal&quot;&gt;var i: Integer;
    begin
       i := 1;
    end.&lt;/code&gt;

  [1]: http://www.w3.org/TR/2011/WD-html5-author-20110809/the-code-element.html

Even if the `pre` is there to distinguish a code *block* from an inline string of code, I don&#39;t see it being a more semantic choice than specifying the *block-ness* of the `code` in a class.

Is there a specific reason the `pre` is recommended over a CSS solution?

Why does HTML5 recommend putting the code element inside pre?

I use &lt;a href=&quot;http://fortawesome.github.com/Font-Awesome/&quot;&gt;font-awesome&lt;/a&gt; and display their fonts like that:

    &lt;i class=&quot;icon-lock&quot;&gt;&lt;/i&gt;

This will display a nice little lock symbol. For the user to know what exactly that means, I tried adding attributes such as title and alt, but to no avail.

Is there any attribute I can use for the `&lt;i&gt;` tag that executes the same task as alt for images and title for links?

Alt or title attribute for i tag

I have an HTML document that currently has some links to the top of the page using an anchor

    &lt;body id=&quot;topofpage&quot;&gt;
       ...
       &lt;a href=&quot;#topofpage&quot;&gt;Go to top&lt;/a&gt;

However, I don&#39;t like needing to create a useless id and how the &quot;#topofpage&quot; shows up in the URL after I click the link. Is there something else I can do to link to the top of the page without using Javascript? I tried removing the anchor completely with `&lt;a href=&quot;&quot;&gt;` but that causes the page to refresh.

Create a Link to the Top of a Web Page Without Using Anchors

I&#39;m having this code:
```html
&lt;ul&gt;
   &lt;div&gt;
   &lt;/div&gt;
&lt;/ul&gt;
```
I feel no issue in my browser rendering it. I have read this too somewhere that ``li`` should only be used as direct child of ``ul``.

Is this correct? Can&#39;t I use ``div`` as a direct child of ``UL``? Is there any documentation for the above confusion?

Edit: This link says I can http://css-tricks.com/forums/discussion/11593/divs-inside-uls/p1

Can I use div as a direct child of UL?

I have an image, and I want to set it a specific width and height (in pixels)

But If I set width and height using css (`width:150px; height:100px`), image will be stretched, and It may be ugly.

How to **Fill** images to a specific size using CSS, and **not stretching** it?

Example of fill and stretching image:

Original Image:

![Original][1]

Stretched Image:

![Stretched][2]

Filled Image:

![Filled][3]

**Please note that in the Filled image example above: first, image is resized to 150x255 (maintained aspect ratio), and then, it *cropped* to 150x100.**

  [1]: http://i.stack.imgur.com/2OrtT.jpg
  [2]: http://i.stack.imgur.com/L1ihk.jpg
  [3]: http://i.stack.imgur.com/vwi7R.jpg

CSS Image size, how to fill, but not stretch?

In my project I need to store an image into a sqlite database and also need to retrieve it to show in my android emulator. When I show it directly after decoding the encoded string, which I got from Java class using sockets, the image displays there. But when I store a byte array code of the string into the sqlite database with the datatype blob and then again retrieve it by using the `getblob()` function it contains a different value and this error occurs: 

    JAVA.lang.NULLPointerException: Factory returns null.

I need a suggestion to store a bitmap image into a sqlite database and also to retrieve it from the sqlite database.

How to store(bitmap image) and retrieve image from sqlite database in android?

Currently I have a paragraph heading and an image to its right, on the same line:

    &lt;div class=&quot;paragraphs&quot;&gt;
      &lt;div class=&quot;row&quot;&gt;
        &lt;div class=&quot;span4&quot;&gt;
          &lt;div class=&quot;content-heading&quot;&gt;&lt;h3&gt;Experience &amp;nbsp &lt;/h3&gt;&lt;img src=&quot;../site/img/success32.png&quot;/&gt;&lt;/div&gt;
          &lt;p&gt;Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.&lt;/p&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;

This works fine - the content-heading and the image are on the same line. However, when I put the image before the content-heading div, they are no longer on the same line. This is what I want to achieve - image then content-heading - on the same line.

Align image to left of text on same line - Twitter Bootstrap3

I am trying to add an image to the **README.md** in my repository using markdown below:

    ![ScreenShot](https://github.com/i-saumitra/Voice-controlled-MP3-Player/blob/master/screenshot.jpg)

But the image is not showing when I visit my repository. 
Instead the link to the image is showing up. Clicking the link will open the image in new window.

I have also tried using relative path:

    ![ScreenShot](screenshot.jpg)

But this is giving page not found error.

What is the correct markdown to display image in **README.md**

Both **README.md** and image file are in same path/directory.


What is the correct way to display an image in github README.md?


Complete content of README.md file is as below:

    Voice-controlled-MP3-Player
    ===========================
    
    A MP3 player which accept voice command like PLAY, PAUSE, FORWARD, etc. Using C# and Microsoft Speech API.
    
    ![ScreenShot](https://github.com/i-saumitra/Voice-controlled-MP3-Player/blob/master/screenshot.jpg)

Image not showing up in README.md on GitHub

I am using following code to execute some statements after page load.

     &lt;script type=&quot;text/javascript&quot;&gt;
        window.onload = function () { 
    	
            newInvite();
            document.ag.src=&quot;b.jpg&quot;;
        }
    &lt;/script&gt;

But this code does not work properly. The function is called even if some images or elements  are loading. What I want is to call the function the the page is loaded completely.

execute function after complete page load

1. How do I return a base64 encoded string given a string?

2. How do I decode a base64 encoded string into a string?


How do I encode and decode a base64 string?

I&#39;m trying to render a page from a pdf with pdf.js

Normally, using a url, I can do this:

    PDFJS.getDocument(&quot;http://www.server.com/file.pdf&quot;).then(function getPdfHelloWorld(pdf) {
      //
      // Fetch the first page
      //
      pdf.getPage(1).then(function getPageHelloWorld(page) {
        var scale = 1.5;
        var viewport = page.getViewport(scale);
    
        //
        // Prepare canvas using PDF page dimensions
        //
        var canvas = document.getElementById(&#39;the-canvas&#39;);
        var context = canvas.getContext(&#39;2d&#39;);
        canvas.height = viewport.height;
        canvas.width = viewport.width;
    
        //
        // Render PDF page into canvas context
        //
        page.render({canvasContext: context, viewport: viewport});
      });
    });

But in this case, I have the file in base64 rather than an url:

    data:application/pdf;base64,JVBERi0xLjUKJdDUxdgKNSAwIG9iaiA8PAovTGVuZ3RoIDE2NjUgICAgICAKL0ZpbHRlciAvRmxhdGVEZWNvZGUKPj4Kc3RyZWFtCnjarVhLc9s2...

How this can be done?

Pdf.js: rendering a pdf file using a base64 file source instead of url

I actually have a file input and I would like to retrieve the Base64 data of the file.

I tried:

    $(&#39;input#myInput&#39;)[0].files[0] 

to retrieve the data. But it only provides the name, the length, the content type but not the data itself.

I actually need these data to send them to Amazon S3

I already test the API and when I send the data through html form with encode type &quot;multipart/form-data&quot; it works.

I use this plugin : http://jasny.github.com/bootstrap/javascript.html#fileupload

And this plugins gives me a preview of the picture and I retrieve data in the src attribute of the image preview. But when I send these data to S3 it does not work. I maybe need to encode the data like &quot;multipart/form-data&quot; but I don&#39;t know why.

Is there a way to retrieve these data without using an html form?

Get data from file input in JQuery

I got a webSocket comunication, I recieve base64 encoded string, convert it to uint8 and work on it, but now I need to send back, I got the uint8 array, and need to convert it to base64 string, so I can send it.
How can I make this convertion?

How to convert uint8 Array to base64 Encoded String?

I need to encode some data in the Base64 encoding in Java. How do I do that? What is the name of the class that provides a Base64 encoder?

---

I tried to use the `sun.misc.BASE64Encoder` class, without success. I have the following line of Java 7 code:

    wr.write(new sun.misc.BASE64Encoder().encode(buf));

I&#39;m using Eclipse. Eclipse marks this line as an error. I imported the required libraries:

    import sun.misc.BASE64Encoder;
    import sun.misc.BASE64Decoder;

But again, both of them are shown as errors. I found [a similar post here][1].

I used Apache Commons as the solution suggested by including:

    import org.apache.commons.*;

and importing the JAR files downloaded from: http://commons.apache.org/codec/

But the problem still exists. Eclipse still shows the errors previously mentioned. What should I do?

  [1]: https://stackoverflow.com/questions/5549464/import-sun-misc-base64encoder-got-error-in-eclipse



Content Type	Original Author	Original Content on Stackoverflow
Question	zozo	View Question on Stackoverflow
Solution 1 - Html	PhonicUK	View Answer on Stackoverflow
Solution 2 - Html	vimist	View Answer on Stackoverflow
Solution 3 - Html	Anmol Saraf	View Answer on Stackoverflow
Solution 4 - Html	Techmaster	View Answer on Stackoverflow

Advantages and disadvantages of using base64 encoded images

Html Problem Overview

Html Solutions

Solution 1 - Html

Solution 2 - Html

Solution 3 - Html

Solution 4 - Html

Raise custom Exception with arguments

Array and slice data types

Attributions