CODEWITHSUNDEEP
c#asp.net-mvcrazorhtml-helper
Ragmar
Ragmar

Reputation: 350

How to write in 1 line with the Html.Helper between 2 text in the same label

Having the following code with HtmlHelper in .cshtml:

<div class="row form-group col-lg-12" >
   @Html.RadioButtonFor(m => m.ScheduleType, "Montly")
   <label>
       On the 
       @Html.DropDownListFor(model => model.DayOfMonth, Model.DayOfMonthList, new { @class = "form-control select2"}) 
       of the month
    </label>
</div>

I want to print those 2 HtmlHelper in 1 line (the RadioButton will enable/disable the dropdown)

Right now, the result I'm having is causing to display the radio button as the image below. I want to print everything in one line. Is there a way to print all of these in the same line just by changing the razor, html or view, or it needs to be manage by something else? (css, jquery,etc)

enter image description here

Upvotes: 0

Views: 1072

Answers (1)

Vadim Martynov
Vadim Martynov

Reputation: 8892

You can to add a wrapper class div with inline-block around your DropDownListFor and text block. It prevents them filling up the whole line, thus rendering them next to eachother, like in the example below.

.wrapper {
  display: inline-block;
}
<label>
    On the 
    <div class="wrapper">
        <select id="dayOfMonth">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select> 
   </div>
   of the month
</label>

Upvotes: 1

Related Questions