Regular Expression Validator - display block rather than inline when dynamic

Question

Is there any way to make a RegularExpressionValidator render itself using display:block, instead of display:inline in its style attribute, when setting the Display property to "Display='Dynamic'"?

I have tried setting it in the stylesheet but this gets overwritten when it is rendered on the page.

Thanks

Answer 1

The idea above on using a css with !Important was so close I could taste it. Using that idea and CSS attribute selectors I did it. I had to use the "contains" selector to get it working in FF, but now I have tested it in IE10, FF and Chrome and so far it is working. It is really simple. Here is a sample validator in my aspx page

<asp:RequiredFieldValidator runat="server" ID="rfvRequired" ErrorMessage="This is required.<br/>This is line 2" ControlToValidate="tbRequired" ValidationGroup="CommonAttributesValidationGroup" SetFocusOnError="True" CssClass="valerror" Display="Dynamic"></asp:RequiredFieldValidator>

Next I have a style for valerror.

span.valerror[style*="inline"]
{
    display:block !Important;
    background-color: Yellow;
    border: 1px solid #cccccc;
    font-size:.9em;
}

That is it. how it works: when the span changes the style from "display:none" to "display:inline" the attribute selector on the span kicks in and forces it to be a block. You just need to make ONE css entry like the one above and make sure you make each validator that class.

Answer 2

Just wrap the validator in a div:

<div><asp:RegularExpressionValidator id="x" runat="server"></div>

Answer 3

I've found the only way to have the control not take up space when it is hidden and also display block is to put a <br /> tag after each validator.

So initially we have this:

Then if there is an error it looks like this:

Answer 4

How about using !important in the CSS class?