Removing the <ul> <li> tag in validation summaries

Question

I have this site that the error message is in this format

<div class="validation-summary-errors"> <span>Password change was unsuccessful. Please correct the errors and try again.</span> <ul> <li>The current password is incorrect or the new password is invalid.</li> </ul> </div> 

Now I want to override the class "validation-summary-errors" to get rid of 'ul' 'li' to have if the line in the above error message is inside the span tag. Therefore, I have the following code as shown below:

 <style type="text/css"> .validation-summary-errors li { list-style: none; margin: 0; padding: 5px -10px 5px 0px; } </style> 

But the above code seems to be inoperative. How to fix this problem.

thanks

Answer 1

Apply the list-style property to ul not li . So try something like this

 .validation-summary-errors ul { list-style: none; margin-left:-40px } 

Answer 2

Do you want to make span and ul / li inline posts?

Try the following:

 .validation-summary-errors ul, .validation-summary-errors li { list-style: none; display: inline; padding: 0; }