The percentage width and height of an element can be set using the w-* and h-* classes, whereby * should be one of the following numbers: 25, 50, 75, or 100. It should be noted that Bootstrap does not offer responsive equivalents for these classes.

The classes are defined as follows:

.w-25 {
     width: 25% !important;
 }

.w-50 {
     width: 50% !important;
 }

.w-75 {
     width: 75% !important;
 }

.w-100 {
     width: 100% !important;
 }

.h-25 {
     height: 25% !important;
 }

.h-50 {
     height: 50% !important;
 }

.h-75 {
     height: 75% !important;
 }

.h-100 {
     height: 100% !important;
 }

The maximum width and height can be set to 100% using mw-100 and mh-100 respectively (note that no helper classes exist to set the maximum width and height values to any other number):

.mw-100 {
     max-width: 100% !important;
 }

.mh-100 {
     max-height: 100% !important;
 }