Hola,
se flotan porque <div> es un elemento de bloque; significa que aunque le des un ancho definido, se "reserva" el resto de la pantalla. Lo del 49% es porque el ancho que defines no incluye bordes; en otras palabras: si defines width: 50% para ambos, en realidad su ancho será de 50% + 1px (por el borde). En este caso, el total será de 100% + 2px, que forzozamente se desborda.
saludos
