diff --git a/mercury/static/mercury/js/sensor.js b/mercury/static/mercury/js/sensor.js
index b19b8260..a99d50f3 100644
--- a/mercury/static/mercury/js/sensor.js
+++ b/mercury/static/mercury/js/sensor.js
@@ -1,51 +1,22 @@
 function addRow(){
-  var sensorList, field_name_li, field_type_li, field_name_input, field_type_select,
-  float_option, string_option, bool_option;
-
-  fields = document.getElementById("field-list");
-  // Make field name input
-  field_name_input = document.createElement("input");
-  field_name_input.setAttribute("type","text");
-  field_name_input.setAttribute("name","field-name");
-  field_name_input.setAttribute("class","inline-block-child");
-  fields.appendChild(field_name_input);
-
-  //Make field type
-  field_type_select = document.createElement("select");
-  field_type_select.setAttribute("name", "field-type");
-  field_type_select.setAttribute("class", "inline-block-child");
-
-  float_option = document.createElement("option");
-  float_option.setAttribute("value", "float");
-  float_option.appendChild(document.createTextNode("Float"));
-  field_type_select.appendChild(float_option);
-
-  string_option = document.createElement("option");
-  string_option.setAttribute("value", "string");
-  string_option.appendChild(document.createTextNode("String"));
-  field_type_select.appendChild(string_option);
-
-  bool_option = document.createElement("option");
-  bool_option.setAttribute("value", "bool");
-  bool_option.appendChild(document.createTextNode("Boolean"));
-  field_type_select.appendChild(bool_option);
-
-  fields.appendChild(field_type_select);
-
-  // Make unit input
-  unit_input = document.createElement("input");
-  unit_input.setAttribute("type","text");
-  unit_input.setAttribute("name","field-unit")
-  unit_input.setAttribute("class", "inline-block-child");
-  fields.appendChild(unit_input);
-
-  var hr = document.createElement('hr');
-  fields.appendChild(hr);
+    var table = document.getElementById("new-sensor-table");
+    var rowCount = table.rows.length;
+    var colCount = table.rows[0].cells.length;
+    var newRow = table.insertRow(rowCount);
+    for(var i=0; i<colCount; i++){
+        var newCell = newRow.insertCell(i);
+        /* set new cell to be same as cell in first data (non-header) row */
+        newCell.innerHTML = table.rows[1].cells[i].innerHTML
+    }
+    table.rows[rowCount].cells[0].innerHTML =rowCount
 }
 
-var add_field_button = document.getElementById("addfieldbutton");
-add_field_button.onclick = function() {
-  addRow();
+function deleteRow() {
+    var table = document.getElementById("new-sensor-table");
+    var rowCount = table.rows.length;
+    if (rowCount > 2){
+        table.deleteRow(rowCount-1)
+    }
 }
 
 /*
@@ -54,10 +25,10 @@ selectView displays the correct view of the "Add or Modify Sensors" page
 -if a user submits a new sensor which posts and reloads page, then the add new sensor view should remain
 */
 function selectView() {
-  var newSensorDiv = document.getElementById("add-new-sensor");
-  var existingSensorDiv = document.getElementById("existing-sensors");
-  var modifyButton = document.getElementById("current-sensor-btn");
-  var newButton = document.getElementById("add-sensor-btn");
+    var newSensorDiv = document.getElementById("add-new-sensor");
+    var existingSensorDiv = document.getElementById("existing-sensors");
+    var modifyButton = document.getElementById("current-sensor-btn");
+    var newButton = document.getElementById("add-sensor-btn");
     if (sessionStorage.getItem('viewing') == 'addingNew'){
         newSensorDiv.style.display = "block";
         existingSensorDiv.style.display = 'none';
@@ -75,8 +46,8 @@ function selectView() {
 }
 
 function displayCurrentSensors() {
-  sessionStorage.setItem('viewing', 'existing');
-  selectView()
+    sessionStorage.setItem('viewing', 'existing');
+    selectView()
 }
 
 function displayAddNewSensor() {
diff --git a/mercury/static/mercury/style.css b/mercury/static/mercury/style.css
index 5eb3fb41..d8dcfa2b 100644
--- a/mercury/static/mercury/style.css
+++ b/mercury/static/mercury/style.css
@@ -11,10 +11,41 @@ body {
 
 tr:nth-child(even) {background-color: #f2f2f2;}
 
-li{
+nav ul{
+    display:flex;
+    justify-content: space-around;
+}
+
+nav li{
+    display: inline-block;
     list-style-type: none; /* removes bulleting */
+}
+
+#sensor-container{
+    background-color:lightgray;
+}
+
+.inline-box{
     display: inline-block;
-    margin: 0% 5%;
+}
+
+.inline-box label{
+    text-align:right;
+    width: auto;
+    min-width:150px;
+}
+
+.sensor-field-row{
+    display: inline-block;
+    vertical-align: middle;
+    border: 1px solid black;
+}
+
+.sensor-field-row-item{
+   display: inline-block;
+   vertical-align: middle;
+   margin: 5px;
+   min-height: 30px;
 }
 
 .topbar-container {
@@ -407,7 +438,7 @@ input#id_can_msg{
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   }
 
-  article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
+  article, aside, figcaption, figure, footer, header, hgroup, main, section {
     display: block;
   }
 
@@ -424,6 +455,7 @@ input#id_can_msg{
   h1, h2, h3, h4, h5, h6 {
     margin-top: 0;
     margin-bottom: 0.5rem;
+    text-align: center;
   }
 
   p {
diff --git a/mercury/templates/sensor.html b/mercury/templates/sensor.html
index d1b9f291..1c581e5c 100644
--- a/mercury/templates/sensor.html
+++ b/mercury/templates/sensor.html
@@ -1,3 +1,5 @@
+<!-- Page styling must be fixed -->
+
 {% load static %}
 <!DOCTYPE html>
 <html lang="en">
@@ -13,23 +15,17 @@
 <body onload="selectView();">
     {% include 'sidebar.html' %}
     <div id="grafana-base"> <!-- app default background -->
-        <div class="panel">
-            <h1> Add or Modify Sensors </h1>
-            <p>
-                This page is used to add new sensors to the database as well as edit currently existing sensors within the database.
-            </p>
-        </div>
+        <h1> Add or Modify Sensors </h1>
 
-        <div class="panel">
-            <nav>
-                <ul>
-                    <li><button onclick="displayCurrentSensors()" id="current-sensor-btn" class="grafana-btn"> Modify Current Sensors </button></li>
-                    <li><button onclick="displayAddNewSensor()" id="add-sensor-btn" class="grafana-btn"> Add New Sensor </button></li>
-                </ul>
-            </nav>
-        </div>
+        <nav>
+            <ul>
+                <!-- Note that the button tag without type="button" will default into type="submit" and POST / GET in some browsers and contexts (like when used inside form) -->
+                <li><button onclick="displayCurrentSensors()" type="button" id="current-sensor-btn" class="grafana-btn"> Modify Current Sensors </button></li>
+                <li><button onclick="displayAddNewSensor()" type= "button" id="add-sensor-btn" class="grafana-btn"> Add New Sensor </button></li>
+            </ul>
+        </nav>
 
-        <div class="panel" id="existing-sensors">
+        <div id="existing-sensors">
             <h2>Existing sensors</h2>
 
             {% if sensors %}
@@ -78,83 +74,66 @@ <h4 class="inline-block-child"><u>Field Unit</u></h4>
             {% endif%}
         </div> <!-- end existing sensors -->
 
-        <div class="panel" id="add-new-sensor">
-            <h2>Add a New Sensor</h2>
-            <br>
-
-            <form method="POST" action="" id="SensorForm"> <!-- Should there be an action? Does sensorForm imply anything?-->
-            {% csrf_token %}
-                <div>
-                    <label for="sensor-name"><b><u>Sensor Name</u></b></label>
-                    <input type="text" id="sensor-name" name="sensor-name"
-                    value="{{ sensor_name }}"/>
-                </div>
-
-                <h4 class="inline-block-child">Field Name</h4>
-                <h4 class="inline-block-child">Field Type</h4>
-                <h4 class="inline-block-child">Field Unit</h4>
-
-                <div id="field-list">
-
-                    {% if sensor_format %}
-
-                        {% for key, value in sensor_format.items %}
-
-                            <input class="inline-block-child" type="text"
-                        name="field-name" value="{{ key }}"/>
-                            <select class="inline-block-child" name="field-type">
-                                {% if value.format == "Float" %}
-                                <option selected="true">Float</option>
-                                {% else %}
-                                <option >Float</option>
-                                {% endif %}
 
-                                {% if value.format == "String" %}
-                                <option selected="true">String</option>
-                                {% else %}
-                                <option >String</option>
-                                {% endif %}
-
-                                {% if value.format == "Boolean" %}
-                                <option selected="true">Boolean</option>
-                                {% else %}
-                                <option >Boolean</option>
-                                {% endif %}
-                            </select>
-                        <input class="inline-block-child" type="text"
-                        name="field-unit" value="{{ value.unit }}"/>
-                        <hr>
-
-                        {% endfor %}
-
-                    {% endif %}
-
-                    <input class="inline-block-child" type="text" name="field-name"/>
-                    <select class="inline-block-child" name="field-type">
-                        <option value="float">Float</option>
-                        <option value="string">String</option>
-                        <option value="bool">Boolean</option>
-                    </select>
-                    <input class="inline-block-child" type="text"
-                    name="field-unit"/>
+        <div id="add-new-sensor">
+            <h2>Configure a New Sensor</h2>
+            <br>
+            <form method="POST">
+                {% csrf_token %}
+                <div id = "sensor-container"> <!-- single div for configuring entire sensor -->
+                    <div class="inline-box">
+                        <label for="sensor-name"> <b>Sensor Name</b> </label>
+                        <input type="text" id="sensor-name" name="sensor-name" required/>
+
+                        <label for="sensor-id-num"> <b>Sensor ID Number</b> </label>
+                        <input type="text" id="sensor-id-num" name="sensor-id-num" required/>
+                    </div> <br>
+
+                    <table id="new-sensor-table">
+                        <thead>
+                            <tr>
+                                <th><b> Field Number </b></th>
+                                <th><b> Field Name </b></th>
+                                <th><b> Field Data Type </b></th>
+                                <th><b> Unit </b> (optional) </th>
+                            </tr>
+                        </thead>
+
+                        <tbody>
+                            <tr>
+                                <td> 1 </td>
+
+                                <td> <input type="text" id="field-name" name="field-names" required/> </td>
+
+                                <td>
+                                    <select id="data-type" name="data-types"/>
+                                        <option> Numeric </option>
+                                        <option> Character </option>
+                                        <option> Boolean </option>
+                                    </select>
+                                </td>
+
+                                <td> <input type="text" id="unit" name="units"/> </td>
+                            </tr>
+                        </tbody>
+                    </table> <br>
+
+                    <div class="inline-box">
+                        <button type="button" onclick="addRow()" class="grafana-btn grafana-btn-gray"> Add Another Sensor Field </button>
+                        <button type="button" onclick="deleteRow()" class="grafana-btn grafana-btn-red"> Delete Last Sensor Field </button> <br><br>
+                    </div>
 
-                    <hr>
+                </div> <br> <!-- end new sensor container -->
 
-                </div>
-                <br>
-                <input align=right class="grafana-btn grafana-btn-blue" type="button" name="addfieldbutton" id="addfieldbutton" value="Add field""right">
-                <br> <br>
-                <div>
-                    <input class="simulator-btn grafana-btn
-                    grafana-btn-green" type="submit" name="submit"
-                    value="Create sensor">
-                </div>
-                <br> <br>
+                <button type="submit" class="grafana-btn grafana-btn-green"> Add New Sensor </button>
             </form>
+            <br>
+        </div>
 
             {% for message in messages %}
             <p class="error"> {{ message }} </p>
             {% endfor %}
+
         </div> <!-- end add new sensors -->
     </div> <!-- end grafana-base -->
 </body>
diff --git a/mercury/views/sensor.py b/mercury/views/sensor.py
index 72be4ad1..3d1e9be0 100644
--- a/mercury/views/sensor.py
+++ b/mercury/views/sensor.py
@@ -30,61 +30,35 @@ def get(self, request, *args, **kwargs):
 
     @require_event_code
     def post(self, request, *args, **kwargs):
-        post_sensor_name = request.POST.get("sensor-name")
-        post_field_names = request.POST.getlist("field-name")
-        post_field_types = request.POST.getlist("field-type")
-        post_field_units = request.POST.getlist("field-unit")
-
-        field_names = list()
-        field_types = list()
-        field_units = list()
-        for i in range(len(post_field_names)):
-            if post_field_names[i]:
-                field_names.append(post_field_names[i])
-                field_types.append(post_field_types[i])
-                field_units.append(post_field_units[i])
-
+        id_num = request.POST.get("sensor-id-num")
+        sensor_name = request.POST.get("sensor-name")
+        field_names = request.POST.getlist("field-names")
+        field_types = request.POST.getlist("data-types")
+        field_units = request.POST.getlist("units")
+
+        # error checking. Note that sensor name, field name and id number
+        # are required by the HTML form. See sensor.HTMLgit
         form_valid = True
-
-        if not post_sensor_name:
-            messages.error(
-                request, ("Sensor name is missing."),
-            )
-            form_valid = False
-
-        sensor = AGSensor.objects.filter(sensor_name=post_sensor_name)
-        if sensor.count() > 0:
-            messages.error(
-                request, ("Sensor name already taken."),
-            )
-            form_valid = False
-
-        if len(field_names) == 0:
-            messages.error(
-                request, ("Sensor must have at least 1 field."),
-            )
+        if len(AGSensor.objects.filter(sensor_name=sensor_name)) > 0:
+            messages.error(request, "Sensor name is already taken.")
             form_valid = False
-
         if check_if_duplicates(field_names):
-            messages.error(
-                request, ("Field names must be unique."),
-            )
+            messages.error(request, "Field names must be unique.")
             form_valid = False
 
+        # create sensor format which is dictionary of dictionaries
         sensor_format = {}
-        for i in range(len(field_names)):
-            if post_field_names[i]:
-                sensor_format[field_names[i]] = {
-                    "unit": field_units[i],
-                    "format": field_types[i],
-                }
+        fields = zip(field_names, field_types, field_units)
+        for field in fields:
+            sensor_format[field[0]] = {"data_type": field[1], "unit": field[2]}
 
         if form_valid:
             sensor = AGSensor.objects.create(
-                sensor_name=post_sensor_name,
+                sensor_id=id_num,
+                sensor_name=sensor_name,
                 sensor_processing_formula=0,
                 sensor_format=sensor_format,
-            )
+            )  # processing formula needs to be adapted
             sensor.save()
             sensors = AGSensor.objects.all()
             context = {"sensors": sensors}
@@ -92,7 +66,7 @@ def post(self, request, *args, **kwargs):
             sensors = AGSensor.objects.all()
             context = {
                 "sensors": sensors,
-                "sensor_name": post_sensor_name,
+                "sensor_name": sensor_name,
                 "sensor_format": sensor_format,
             }