cssgoogle-chromeadobespry

Spry validation text field not displaying well in google Chrome

I am using spry validation text field in a project and the error message does not display well in google chrome but it displays well in mozilla firefox.I would want the error message to display in google chrome the way it displays in firefox.

This is the way the error messages display in firefox.enter image description here

google chrome,

enter image description here

CSS Styling of the error messages 

 display: inline;
        color: #CC3333;
            border: 1px solid #CC3333;
            border-radius: 10px;
            margin-left: 10px;
            padding-left:8px;

            padding-right: 8px;
            font-family:"Helvetica Neue";

Thanks for your help.

Solution

  • Use display: block; in the place of display: inline; It will work fine.

    display: block;
        color: #CC3333;
            border: 1px solid #CC3333;
            border-radius: 10px;
            margin-left: 10px;
            padding-left:8px;

            padding-right: 8px;
            font-family:"Helvetica Neue";