1

I have a page with error message hidden using display: none;

When page loads, the error message was shown briefly and then went away. It seems ccs applies slowly to the page.

How can I improve the user experience and not allow the error message to display when loading?

The page also loads a table using Ajax call. Could this affect how css applies to the page?

Thanks.

Pavlo
  • 43,301
  • 14
  • 77
  • 113
user2251102
  • 13
  • 3

2 Answers2

1

Simply add style="display:none;" to the actual html elements or div's on the page that you don't want to show initially. You can't rely on the CSS file right away. For example:

<div class="error" style="display:none;">
    <span class="myerror">Hello World!</span>
</div>

Other than this exception for the hidden areas, it's typically best to keep all your css decoupled from the page and in an external file.

jon__o
  • 1,509
  • 13
  • 14
1

If you call your CSS file with <link> then you should try to put your CSS in <style> instead. Should be faster. As the external file needs longer to load then <style> which you have in the same file.

johan smohan
  • 13
  • 1
  • 6