Q:

display inline not working for me in firefox

I have in Html:
            <div class="login">
            <form class="form-horizontal signin">
                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">Email : </label>
                    <div class="col-sm-5 more">
                        <input type="email" class="form-control top" id="emailLogin" placeholder="Email" size="100">
                    </div>
                </div>
                <div class="form-group">
                    <label for="inputPassword3" class="col-sm-2 control-label">Password : </label>
                    <div class="col-sm-5 passLog">
                        <input type="password" class="form-control" id="passwordLogin" placeholder="Password">
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-default">Sign in</button>
                    </div>
                </div>
            </form>
        </div>

and I have in jquery this code:
$(".signin").submit(function(){
    $('.error').remove();
    var hasError = false;
    if($.trim($("#emailLogin").val())=="")
    {
        $(".more").append('<span class="glyphicon glyphicon-remove error" role="alert"></span>');
        hasError = true;
    }
    if($.trim($("#passwordLogin").val())=="")
    {
        $(".passLog").append('<span class="glyphicon glyphicon-remove error" role="alert"></span>');
        hasError = true;
    }
    if(hasError == true)
        return false;
    else
        return true;
});

the span display a block structure
and I what to display that a inline structure
in css need to solved that is:
display:inline;

work in chrome but not in firefox

A:

Based on the class names in your snippet, you are using Bootstrap.
You are also trying to add an icon to indicate some validation state.
The good news is that this is already built into the Bootstrap framework:
http://getbootstrap.com/css/#forms-control-validation
You need to add some extra Bootstrap class names in your code as shown below.

In the span that you are adding to the DOM using jQuery, add the class name form-control-feedback.
In the .form-group blocks, add the classes has-error has-feedback
Make sure that the id values match the corresponding values in the for attributes connecting your label and input fields

$(".signin").submit(function(){
    $('.error').remove();
    var hasError = false;
    if($.trim($("#emailLogin").val())=="")
    {
        $(".more").append('<span class="glyphicon glyphicon-remove error form-control-feedback" role="alert"></span>');
        hasError = true;
    }
    if($.trim($("#passwordLogin").val())=="")
    {
        $(".passLog").append('<span class="glyphicon glyphicon-remove error form-control-feedback" role="alert"></span>');
        hasError = true;
    }
    if(hasError == true)
        return false;
    else
        return true;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha256-7s5uDGW3AHqw6xtJmNNtr+OBRJUlgkNJEo78P4b0yRw= sha512-nNo+yCHEyn0smMxSswnf/OnX6/KwJuZTlNZBjauKhTK0c+zT+q5JOCx0UFhXQ6rJR9jg6Es8gPuD2uZcYDLqSw=="
crossorigin="anonymous">
<div class="login">
  <form class="form-horizontal signin">
    <div class="form-group has-error has-feedback">
      <label for="emailLogin" class="col-sm-2 control-label">Email :</label>
      <div class="col-sm-5 more">
        <input type="email" class="form-control" id="emailLogin" placeholder="Email">
      </div>
    </div>
    <div class="form-group has-error has-feedback">
      <label for="passwordLogin" class="col-sm-2 control-label">Password :</label>
      <div class="col-sm-5 passLog">
        <input type="password" class="form-control" id="passwordLogin" placeholder="Password">
      </div>
    </div>
    <div class="form-group">
      <div class="col-sm-offset-2 col-sm-10">
        <button type="submit" class="btn btn-default">Sign in</button>
      </div>
    </div>
  </form>
</div>

