CODEWITHSUNDEEP
htmlcss
Doc Holiday
Doc Holiday

Reputation: 10254

HTML align elements in a TD all next to each other

i jus added this slider next to a input and added a input box after the slider. Problem is they are underneath my first input. I want them all side by side in the TD tag....please help...let me know if you need more code:

    <td>$
    <input name="sup" style="text-align: left;" maxlength="13"

                    value="${form.sup}"

            onkeypress="javascript:return noenter();" />
<div id="calcSlider"></div>
<input type="text" id="calcRepairCostFactor" name="calcRepairCostFactor" value="10" size="3" readonly="readonly"/>            
</td>

jquery:

$(function () {
$("#calcSlider").slider({ min: 0,
                          max: 90,
                          step: 5,
                          value: 10,
                          slide: function (event, ui) {
                              $("#calcRepairCostFactor").val(ui.value);
                          }
                       });
                    });

ANSWER:

  <td>$
    <input name="sup" style="text-align: left;" maxlength="13"

                    value="${form.sup}"

            onkeypress="javascript:return noenter();" />
<div id="calcSlider" style='display: inline-block; width: 100px; height: 12px;'></div>
+/-
<input type="text" id="calcRepairCostFactor" name="calcRepairCostFactor" value="10" size="3" readonly="readonly"/>            
%
</td>

Upvotes: 0

Views: 5039

Answers (1)

kitti
kitti

Reputation: 14804

Not much info... I'm guessing you probably need to add style='display: inline-block;' to the div to get the result you're looking for.

Upvotes: 2

Related Questions