Symbols not displayed properly in custom fonts - html

Question

I downloaded the Webfont Kit (for Quicksand font) from font squirrel website; and I am trying to display the word Erdös using the new font; using the HTML entry ö however, does not seem to work.
Looking at the list of glyphs for that font (Quicksand); I can see that they have the letter o (both capital letter and small letter) with two dots on top of it.
Here is what I'm getting:
As shown in the above picture, the other letters are displayed correctly (using the correct font); but not the o with two dots!
Here is my HTML code:
<h1 id="erdos">Erdös</h1>
Where I specify erdos in my css file to use that font!
Edit: I'm posting additional information/code about the question:
I downloaded the Webfont Kit from the Webfont Kit tab from the same page.
CSS:
#font-face {
font-family: 'QuicksandLight';
src: url('fonts/Quicksand/Quicksand_Light-webfont.eot');
src: url('fonts/Quicksand/Quicksand_Light-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/Quicksand/Quicksand_Light-webfont.woff') format('woff'),
url('fonts/Quicksand/Quicksand_Light-webfont.ttf') format('truetype'),
url('fonts/Quicksand/Quicksand_Light-webfont.svg#QuicksandLight') format('svg');
font-weight: normal;
font-style: normal;
}
h1#erdos {
margin-top: 0;
margin-bottom: 0;
font-family: quicksandlight;
}
I tested the output in both Chrome 27.0 and Firefox 21.0
The output of Chrome is:
The output of Firefox is:

Answer 1

On the Webfont Kit page at FontSquirrel, you need to select “Don’t Subset” in the dropdown “Choose a Subset:”. The default there is “English”, which apparently means that only Ascii letters are included.