Location of Validation Message - asp.net-mvc

Question

In this guide that I was attempting to follow, validation messages show up to the right and are red. Mine appear dull and to the left, as in the picture below.
I have read and reread the guide I linked to, but I can't see any major difference between his code and mine. Why do my Label and TextBox show up in the order I created them, while my validation messages show up in between?
Here is (what I believe to be) the relevant part of my model
[Required(ErrorMessage = "Required")]
[Display(Name="IP Address")]
public string address { get; set; }
[Required(ErrorMessage = "Required")]
[Display(Name = "TCP Port")]
public int port { get; set; }
and the corresponding part of my View.
<p>
#Html.LabelFor(c => c.address):
#Html.TextBoxFor(c => c.address)
#Html.ValidationMessageFor(c => c.address)
</p>
<p>
#Html.LabelFor(c => c.port):
#Html.TextBoxFor(c => c.port)
#Html.ValidationMessageFor(c => c.port)
</p>
I realize that typical validation on items like these would be more robust. For now, my only concern is that they did not leave the field blank.

Answer 1

Have you tried adding this to your main css file?
.input-validation-error
{
border: 1px solid #ff0000;
background-color: #ffeeee;
}
.field-validation-error {
background-color:white;
border-radius:4px;
border: solid 1px #333;
display: block;
position: absolute;
top:0; right:0; left:0;
text-align:right;
}

Answer 2

I was having a similar issue. The validation message for my first input box was right aligned while all the rest were left aligned. Updating my style sheet with the code below fixed the problem.
.field-validation-error {
display: block;
text-align:right;
}

Answer 3

The Input boxes were somehow given the property float: right. The validation messages, by default, float left. By removing the float property of the Inputs, the validation messages are now showing up to the right of the Inputs.
Furthermore, by pressing F12 in the browser while the project is running, one can view the styles being applied to elements. Additionally, one can just right-click the element and "inspect element". I at least confirmed that alternative in Chrome and IE10.
Hopefully that trick will help someone else avoid looking at MVC for problems caused by a ninja CSS.