I am having some format issue with a table I am working on. See screenshot snap of table row below:
Below is the html for my table - so the problem is if I do an F12 and highlight the * column it is showing as taking up alot of space and not just 5px which I have specified - which then pushes the validation messages up and doesnt lok nice when there is space they could be filling. Is there something silly I am missing?\[code\]<table class="ui-widget-content" style="width: 565px; height: 200px; margin-top: 10px;"> <tr> <td style="width: 10px;"></td> <td class="label">Forename : </td> <td class="value"> @Html.TextBoxFor(model => model.Forename, new { id = "foreName", style = "width:150px" }) </td> <td style="width:5px;">*</td> <td class="field-validation-error" style="width: 180px;"> @Html.ValidationMessageFor(model => model.Forename) </td> </tr> <tr> <td style="width: 10px;"></td> <td id="FloorText" class="label">Surname : </td> <td class="value"> @Html.TextBoxFor(model => model.Surname, new { style = "width:150px" }) </td> <td style="width:5px;">*</td> <td class="field-validation-error" style="width: 180px;"> @Html.ValidationMessageFor(model => model.Surname) </td> </tr> <tr> <td style="width: 10px;"></td> <td class="label">Email Address : </td> <td class="value"> @Html.TextBoxFor(model => model.Email, new { style = "width:150px" }) </td> <td style="width:5px;">*</td> <td class="field-validation-error" style="width: 180px;"> @Html.ValidationMessageFor(model => model.Email) </td> </tr></table>\[/code\]Edit - Question edited to show screenshot of code in F12 - it seems to be the span that is auto generated - how can I add a width to this?