Override FOSUserBundle login form

Question

I'm trying to override FOSUserBundle login template with my personal design. Now, I have just a problem with error messages.

If I try the default script :

{% if error %}
    <div>{{ error.messageKey|trans(error.messageData, 'security') }}</div>
{% endif %}

I have my error message. But when I try using a div class to give some look to my error, like this :

<div class="alert alert-danger display-hide">
   {% if error %}
   <button class="close" data-close="alert"></button>
   <span>{{ error.messageKey|trans(error.messageData, 'security') }}</span>
   {% endif %}
</div>

doesn't work I have no error message displayed in my screen. Please help, maybe its easy to resolve but I have no idea and I don't like to lose time with a simple tinks.

PS: Sorry for my english

Answer 1

Ok I deleted display-hide class and I have my message just for the bad credentials not for empty input.

<div class="form-group">
                <label class="control-label visible-ie8 visible-ie9">{{ 'security.login.username'|trans }}</label>
                <input class="form-control form-control-solid placeholder-no-fix" type="text" autocomplete="off" placeholder="Utilisateur" id="username" name="_username" required="required" />
            </div>
            <div class="form-group">
                <label class="control-label visible-ie8 visible-ie9">{{ 'security.login.password'|trans }}</label>
                <input class="form-control form-control-solid placeholder-no-fix" type="password" autocomplete="off" placeholder="Mot de passe" id="password" name="_password" required="required" />
            </div>
            <div class="form-actions">
                <input type="submit" id="_submit" class="btn btn-success uppercase" name="_submit" value="{{ 'security.login.submit'|trans }}" />
                <label class="rememberme check">
                    <input type="checkbox" id="remember_me" name="_remember_me" value="on" />{{ 'security.login.remember_me'|trans }}
                </label>
            </div>

I have no message for empty input !!