how to convert html to pdf by DOM-PDF with proper HTML design

I am using DOM-PDF for converting HTML to PDF in LARAVEL 5.4 PDF conversion is good. But HTML page design is disturbing.

showalumni.blade.php:

<div class="panel-body panel-body-com-m">
<a href="">Download to pdf</a>
<hr>
  <label>Name : </label>
  <input type="text" class="form-control1 control3" value=""  required readonly readonly>
  <label>Father's Name :  </label>
  <input type="text" class="form-control1 control3" value=""  required readonly>
  <label>Gender :  </label>
  <input type="text" class="form-control1 control3" value=""  required readonly>
  <label>College :  </label>
  <input type="text" class="form-control1 control3" name="colleges_name" value=""  required readonly />
  <label>Course :  </label>
  <input type="text" class="form-control1 control3" placeholder="Course name...." name="courses_name" value=""  required readonly />
</div>

route:

Route::resource('registeredalumnies','Admin\RegisteredAlumniesController');
Route::get('pdf/{id}','Admin\RegisteredAlumniesController@download');

Controller:

public function show($id)
{

    $showalumni = User::where('id',$id)->with('showcollege','showcourse')->first();
    return view('Admin.showalumni',compact('showalumni'));
}

public function download($id)
{

    $showalumni = User::where('id',$id)->with('showcollege','showcourse')->first();
    $pdf = PDF::loadView('Admin.showalumni', compact('showalumni'));
    return $pdf->stream('invoice.pdf');
}

Converted PDF is: This is the pdf file. But HTML design is not in proper way

via Chebli Mohamed