I need some help with Configurable List to fit into 2 rows

The configurable list is perfect for what I'm trying to accomplish.

I've read thru numerous questions on the forum but I haven't found one that addresses my issue.

 

I would like the form to wrap onto multiple lines I found some code to put in which basically got me started but unfortunately I cant get the column labels to show once I submit the form.

I ended up removing any of that code to clean it up as it ended up looking messy.

Thank you for your assistance

Thank you for contacting us. 

If you inject following CSS code, I think that configurable list will be seen as you wish or in a better way.

.checkbox, .radio {

margin: 3px 0;

min-width: 70px;

}

td.col4 {

   display: block; 

   position: relative;

   float: left;

   margin-left: -1px;

   margin-top: 30px;

} 

td.col5 {

  display: block;

    float: left;

    margin-top: 30px;

    position: relative;

}

td.col6 {

  display: block;

    float: left;

  margin-top: 30px;

    position: relative;

}

td.col7 {

  display: block;

 float: left;

   margin-top: 30px;

    position: relative;

}

textarea {

    width: 120px;

    height: 40px;

}

th {

   display: none;

}

.col1:before, .col2:before, .col3:before, .col4:before, .col5:before, .col6:before, .col7:before {

   font-weight: bold;

   display: block;

}

td.col1:before {

   content:"Last Name";

}

td.col2:before {

   content:"First Name";

}

td.col3:before {

   content:"Date";

}

td.col4:before {

   content:"Earning/Deduction";

}

td.col5:before {

   content:"Hours";

}

td.col6:before {

   content:"Dollars";

}

td.col7:before {

   content:"Notes";

}

tr {

display: block;

 

}

This is the screen shot of how you will see configurable list after injection of above code. 

This is the screen shot of where you inject this code



If you need any further assistance by our side, please let us know. We would be pleased to help you. 

Thank you for your assistance
Yeruchom Levovitz
...