title: CSS style shows after refresh and then goes invisible with Knockout
body: <p>So I have a new notification style ring and green circle with unread notifications in it this circle only is visible when you have new notifications.<a href="https://i.stack.imgur.com/SY6Co.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/SY6Co.png" alt="New 1 Notification"></a></p>
  
  <p>when page is refreshed even if you dont have a notification the circle is visible for a second and then goes invisible</p>
  
  <p><a href="https://i.stack.imgur.com/THo9W.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/THo9W.png" alt="enter image description here"></a></p>
  
  <p>If there is a new notification still when refreshed circle shows up empty or with zero and then goes invisible and then with correct number</p>
  
  <p><strong>HTML</strong>:</p>
  
  <pre><code>&lt;div class="bell"&gt;
      &lt;div class="unseen-notification-show" data-bind="visible: UnSeenMessagesCount() &gt; 0, text: UnSeenMessagesCount()" style="display:none"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong>:</p>
  
  <pre><code>.unseen-notification-show {
      content: '';
      display: block !important;
      position: absolute;
      top: -10px;
      right: -8px;
      width: 17px;
      height: 17px;
      border: 1px solid #ffffff;
      background-color: #8cdb16;
      border-radius: 8px;
      cursor: pointer;
      z-index: 3;
      color: white;
      text-align: center;
      line-height: 15px;
      font-size: 11px;
      font-family: 'Times New Roman', Times, serif;
  }
  
  self.searchModel = new AuthorizedSearchViewModel();
  self.Header = ko.observable(new HeaderModel());
  self.UnSeenMessagesCount = ko.observable(0);
  self.Messages = ko.observableArray();
  self.CanShowRemindProfile = ko.observable(false);
  self.Remind = ko.observable(new RemindModel());
  
  self.LoadUserInformation = function () {
      $.post('/User/GetUserInfoForDashboardHeader',
          function (response) {
              InitTawkChat(response);
              self.Header(new HeaderModel(response));
  
              if ($('#accountId').length &gt; 0) {
                  $('#accountId').html(response.accountId);
              }
  
          }, "json").done(function () { console.warn("loaderOff"); });
  };
  
  self.GetRemindProfile = function () {
      self.CanShowRemindProfile(false);
      $.post('/User/GetRemindProfile', function (result) {
          if (result) {
              self.CanShowRemindProfile(true);
              self.Remind(new RemindModel(result));
          }
      });
  };
  
  self.GetMessages = function () {
      $.post('/Messages/GetAll', {
          page: 1,
          pageSize: 4
      }, function (result) {
          var notifications = [];
  
          _.map(result.Notifications, function (item) {
              notifications.push(new MessageModel(item));
          });
  
          self.Messages(notifications);
          self.UnSeenMessagesCount(result.UnseenNotifications);
      });
  };
  </code></pre>