PHP Image resizing before uploading in the specified Directory

Hi I'm developing a site wherein a user can upload his/her profile picture. My upload page has an img tag so that a user can preview what their image would look like before they upload it after they have selected this picture the thing is the image's name would be fetched from the database later on. here is my the snippet for it

 <img id="imgs" src="http://ift.tt/K6GcHn" alt="your image"/>

my uploader goes something like this

if ( !!$_FILES['file']['tmp_name'] ) // is the file uploaded yet?
{
    $info = explode('.', strtolower( $_FILES['file']['name']) ); // whats the extension of the file
    $temp = explode(".",$_FILES["file"]["name"]);
    $filename = rand(1,9999) . '.' .end($temp);
    if ( in_array( end($info), $allow) ) // is this file allowed
    {
        if ( move_uploaded_file( $_FILES['file']['tmp_name'], $todir .  $filename ) )
        {

        }
    }
    else
    { }
}

by the way this uploader script is from a tutorial so yeah you might find several security and other issues here..

What I'm having trouble is the image looks fine when I uploaded an image with a dimension of 200x200 because in my css I have defined imgs with a width and height set both at 200px but if I uploaded other images that doesnt meet the the width and height that I have set on my css the image turns into stretched if its bigger

Any ideas out there how can I fix this? I also tried defining sizes on the img directly and turned out the same obviously can I fix this with just css alone?