DataTable components bootstrap

after following the link https://datatables.net/examples/basic_init/scroll_y_dynamic.html expected the table layout to be constant for all the screen resolutions
But the table opened in different screens, the footer part marked in orange border is becoming large for large screens and same case for the data part marked in yellow(becomes smaller).

 .DataTable({

            "scrollY": "70%",
            "scrollX": false,
            "showNEntries": true,
            "scrollCollapse": false,
            "autoWidth": true,
            "sAjaxSource": urlDataRetrieval,
            "sAjaxDataProp": "",
            "searching": true,
            "pageLength": 50,
            "order": [
                [0, "asc"]
            ],

Is there any make the header,middle part and footer part of the table occupies constant percentage according to the screen automatically?

Screen shot