[Pregunta]: Options no se desplazan correctamente

[Leguim]

Creo que ahí esta..

https://jsfiddle.net/o69dcx12/

si te fijas ahí aparece el select de como se vería, y esta deformado porque no aparecen las opciones a no ser que hagas scroll dentro del select
si al final no entendes lo que pasa o por qué del error comenta este tema diciendo que no sabes, así no  sigo esperando una respuesta 

[#!drvy]

La verdad es que no he entendido muy bien cual es el problema... pero... te estas complicando demasiado. Por lo que veo de código que has expuesto, estas usando un select con literalmente miles de municipios. Eso es una carga muy pesada tanto para el servidor como para el navegador del cliente y muy poco práctico para futuras actualizaciones.

Yo te sugeriría que empieces a leer sobre lazy loading y peticiones AJAX. Te va a facilitar la vida y te ayudará a desarrollar aplicaciones fácilmente actualizables. El ejemplo que te muestro a continuación es muy básico con arrays en PHP, lo ideal seria utilizar base de datos pero bueno...

Codigo HTML

Código (html5) [Seleccionar] Expandir

<select id='selectCuidades' data-tipo='cuidades'>
   <option disabled selected>Seleccionar</option>
</select>

<select id='selectLocalidades' data-tipo='localidades'>
   <option disabled selected>Seleccionar</option>
</select>

<script src='localidades.js'></script>

Codigo JS (localidades.js)

Código (javascript) [Seleccionar] Expandir

// Es mejor esperar a que este cargado todo el DOM.
document.addEventListener('DOMContentLoaded', function(e){

   // Cargar la primera vez. En este caso cargaria las cuidades con indice
   // 0 en $cuidades del PHP.
   cargarOpciones('cuidades', 0, function(opciones){
       pintarOpciones('selectCuidades', opciones);
   });

   // Cuando el select "selectCuidades" cambie, obtendra la cuidad selecionada
   // su valor y realizara una consulta para obtener las localidades pertinentes
   // a esa cuidad.
   document.getElementById('selectCuidades').addEventListener('change', function(e){
       var index = this.options[this.selectedIndex].value; // valor del elemento seleccionado
       cargarOpciones('localidades', index, function(opciones){
           pintarOpciones('selectLocalidades', opciones);
       });
   });

});


/**
* Hace un AJAX a un archivo PHP que le da las opciones para cada cuidad.
* Si le retorna un error, avisa de ello mediante alert.
*
* @param {string} tipo
* @param {integer} valor
* @param {function||object} callback
*/
var cargarOpciones = (function(tipo, valor, callback){
   var url = 'localidades.php?tipo='+tipo+'&index='+valor;
   var request = new XMLHttpRequest();
   request.open('GET', url, true);
   request.onload = function() {
     if (request.status >= 200 && request.status < 400) {
       var data = JSON.parse(request.responseText);

       if(data.error) {
           alert('No existen datos');
           return false;
       }

       callback(data);
     }
   };
   request.send();
});


/**
* Pinta los elementos que ha obtenido dentro de un select con el id indicado.
*
* @param {integer} idElemento
* @param {array} opciones
*/
var pintarOpciones = (function(idElemento, opciones){
   var elemento = document.getElementById(idElemento);
   elemento.innerHTML = '';

   opciones.forEach(function(valor, index){
       var opcion = document.createElement('option');
       opcion.value = index;
       opcion.innerText = valor;
       elemento.appendChild(opcion);
   });
});


Codigo PHP (localidades.php)

Código (php) [Seleccionar] Expandir

<?php
$cuidades = array(
    0 => array(
        0 => 'Adolfo Alsina',
        1 => 'Adolfo González Chavez',
        2 => 'Alberti',
    )
);

$localidades = array(
    0 => array( // El 0 representa el 0 de $cuidades (Adolfo Alsina)
        0 => 'Carhué',
        1 => 'Rivera',
        2 => 'Villa Maza',
        3 => 'San Miguel Arcángel',
        4 => 'Esteban Agustín Gascón',
        5 => 'Delfín Huergo',
        6 => 'La Pala',
        7 => 'Thames',
        8 => 'Yutuyaco',
    ),
    1 => array( // Lo mismo, representa el 1 de 1 de $cuidades (adolfo Gonzalez)
        0 => 'Gonzáles Chaves',
        1 => 'De la Garma',
        2 => 'Juan Eulogio Barra',
        3 => 'Vásquez',
    ),
    2 => array( // etc...
        0 => 'Alberti',
        1 => 'Mechita',
        2 => 'Villa Ortiz',
        3 => 'Plá',
        4 => 'Coronel Seguí',
        5 => 'Villa Grisolía',
        6 => 'Villa María',
        7 => 'Gobernador Ugarte',
    ),
);

$tipo = $_GET['tipo']; // cuidades o localidades
$valor = (int) $_GET['index']; // esperamos un valor solo numerico
$resultado = array('error' => 'no encontrado'); // si no encuentra nada...

switch($tipo) {
    case 'cuidades':
        if (isset($cuidades[$valor])) {
            $resultado = $cuidades[$valor];
        }
        break;

    case 'localidades':
        if (isset($localidades[$valor])) {
            $resultado = $localidades[$valor];
        }
        break;
}
die(json_encode($resultado)); // imprimimos un JSON
?>

Esto incluso se puede simplificar aún más haciendo que PHP imprima los option en vez de crearlos con JS pero es mejor que los cree el propio navegador.

https://es.wikipedia.org/wiki/Lazy_loading
https://www.w3schools.com/xml/ajax_intro.asp
https://es.wikipedia.org/wiki/JSON

Saludos

[Leguim]

Gracias amigo! voy a probar a ver que tal..