CSS Form, ASP.NET Validation Summary is Wonky

Question

Ok, this is driving me insane.

I have a form and I'm not using tables. Each row is a p tag and consists of a label and a control. When I add a validation summary at the bottom it goes wonky.

How do I get the validation summary to line up properly?

.Label
{
    float: left;
    width: 12em;
    text-align: right;
    padding-right: 1em;
}

.TextBox
{
    display: inline-block;
    width: 244px;
}

<p>
    <asp:Label runat="server" ID="uxNotesLabel" CssClass="Label">Notes</>
    <asp:TextBox runat="server" ID="uxNotesTextBox" CssClass="TextBox" TextMode="MultiLine" Rows="5"></asp:TextBox>
</p>

<p>
    <asp:Label runat="server" ID="uxSpaceLabel3" CssClass="Label"></asp:Label>
    <asp:ValidationSummary runat="server" ID="uxMaterialNeedValidationSummary" ValidationGroup="AddMaterialNeed" ForeColor="Red" />
</p>

That gives me this:

PatienceTester

This may sound silly, but did try adding a class to the validation summary and apply styles to it? And what is it that you want to line up? The text to be centered or do you want the box aligned to the right? — xsearingheaven, Jun 18 '13 at 16:43

score 1 · Accepted Answer · answered Jun 18 '13 at 16:46

1

not too clear:

Would you need CSS like:

#uxMaterialNeedValidationSummary {text-align:center;}

or

#uxMaterialNeedValidationSummary {padding-left:12em;}

Whatever id or class is avalaible

answered Jun 18 '13 at 16:46

G-Cyrillus

101,410
14
105
129

Thanks @GCyrillus I can use the padding to align the summary how I like. – Westicle Jun 19 '13 at 08:12

CSS Form, ASP.NET Validation Summary is Wonky

1 Answers1