After turning on the checkbox, the style value for the specified div changes. The value is set left:0; and width: 245px;

 #on:checked ~ .div { left:0; width: 245px; } .div { position: fixed; left:-245px; } 
 <input id="on" type="checkbox"> <label for="on">Клацать</label> <div class="div">текст</div>

The wonders are that after reloading the page, the CSS value for the div does not return to the left:-245px;

How to return the value for the class div after reloading the page in Firefox browser?

  • This is some kind of nonsense in the browser. He does not refresh the page - Yuri
  • Question updated / clarified. - Viher
  • I myself am shocked by this miracle. - Viher
  • one
    Try to do the same function using JS. There should work correctly. It's just that Firefox doesn’t clear the input checkbox when the page is refreshed - Yuri
  • I'm trying to get rid of JS in this way. - Viher

1 answer 1

The solution was quite simple. On the W3C there is an example of how to disable automatically setting a check mark for the input element.

https://www.w3.org/TR/html5/forms.html#autofocusing-a-form-control:-the-autofocus-attribute

 <input id="on" type="checkbox" autocomplete="off">