JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.dv.js"></script>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>
<link href="https://igniteui.com/css/apiviewer.css" rel="stylesheet" type="text/css"></link>

<div class="optionsColumn">
        <div id="barcode" style="float: left;"></div>

        <div id="barcodeOptions" class="options">
            <label class="title"><b>Options</b></label>
            <div>
                <div class="optionsRows">
                    <label class="labels">Bars Brush</label>
                    <select id="barBrush" class="selector">
                        <option>Black</option>
                        <option>Blue</option>
                        <option>Green</option>
                    </select>
                </div>
                <div class="optionsRows">
                    <label class="labels">Backing Brush</label>
                    <select id="backingBrush" class="selector">
                        <option>White</option>
                        <option>Yellow</option>
                        <option>LightGray</option>
                    </select>
                </div>
                <div class="optionsRows">
                    <label class="labels">Backing Outline</label>
                    <select id="backingOutline" class="selector">
                        <option>Black</option>
                        <option>Transparent</option>
                        <option>Green</option>
  ...

CSS

.labels { 
                width: 100%; 
                float: left;
        } 
        .title { 
                width: 100%; 
                 margin: 20px 20px 0px 0px;
        } 
        .values {  
                margin: 10px 0px 0px 0px;
        }
        .slider {
                width: 100px;
                margin: 10px 0px 0px 0px;
        } 
        .selector {
                float: left;
                width: 100px;
                margin: 4px
        } 
        .options { 
                width: 250px;
                margin: 0px 20px 20px 20px;
                float: right;
                /*background: yellow;*/
        } 
        .optionsColumn { 
            width: 100%; 
            margin: 2px;
            padding: 2px; 
            /*background: #4EDECC;*/
        }
        .optionsRows {
            position: relative;
            float: initial; 
            width: 250px;
            margin: 2px 2px 2px 2px;
            display: inline-block;
            padding-top: 0px; 
            /*background: #DE604E;*/
        }

JavaScript

$(function () {
            $("#barcode").igQRCodeBarcode({
                height: "200px",
                width: "200px",
                data: "http://www.infragistics.com/products/jquery/",
                barBrush: "black",
                backingBrush: "white",
                backingOutline: "black",
                backingStrokeThickness: 1
            });

            $("#backingBrush").change(function () {
                var val = $("#backingBrush").val().toLowerCase();
                $("#barcode").igQRCodeBarcode("option", "backingBrush", val);
            });

            $("#backingOutline").change(function () {
                var val = $("#backingOutline").val().toLowerCase();
                $("#barcode").igQRCodeBarcode("option", "backingOutline", val);
            });

            $("#barBrush").change(function () {
                var val = $("#barBrush").val().toLowerCase();
                $("#barcode").igQRCodeBarcode("option", "barBrush", val);
            });

            $("#backingStrokeThickness").slider({
                min: 0, max: 10, value: 1, step: 1,
                slide: function (event, ui) {
                    $("#barcode").igQRCodeBarcode("option", "backingStrokeThickness", ui.value == 0 ? 0.01 : ui.value);
                    $("#backingStrokeThicknessLabel").text(ui.value);
                }
            });
        });