How to limit the width of dropdown list

I have an html table that contains a few dropdownlist. <table> <thead> <tr> <th>@Html.LabelFor(model => model.WorkorderId)</th> <th>@Html.LabelFor(model => model.SubmissionDate)</th> <th>@Html.LabelFor(model => model.PartId)</th> <th>@Html.LabelFor(model => model.ActivityId)</th> </tr> </thead> <tbody> <tr> <td>@Html.DropDownList("WorkorderId", (SelectList) ViewBag.Workorders, string.Empty)</td> <td>@Html.TextBoxFor(model => model.SubmissionDate, "{0:MM/dd/yyyy}", new { @class = "datefield" })</td> <td>@Html.DropDownList("PartId", (SelectList) ViewBag.Parts, string.Empty)</td> <td>@Html.DropDownList("ActivityId", (SelectList) ViewBag.Activities, string.Empty)</td> </tr> </tbody> </table> One of the column (The PartId column), has a very long description. It almost take the whole page. 12345 - The very long description for Part I want to limit the width of the dropdown list to as long as the PartNumber (without the Description). Right now the the width of the dropdown list is equal to the longest of the PartNumer - Description. Is there a way to only show the PartNumber (12345) when the it's selected, but show the whole thing (Number - Description) when the dropdown is click?