Making footer widgets responsive

Set the width of the div to 100% and remove the float for the media query used for smaller screens like this:

@media screen and (max-with 600px){

.widget-area{
float: none;
width: 100%;
}

}

And for the desktop view:

@media screen and (min-with 600px){

.widget-area{
float: left;
width: 25%;
}

}   

BTW, this is just CSS related and has nothing to do with WordPress