How to toggle Effect in Div using only css?

Question

Note: I tried all questions & answers related this topic. Additionally and I tried related questions and try to solve it but not success. So please read m

Answer 1

You can use a checkbox input and based on if this is checked or not you can show hide the div.

below is a example using the same.

.clicker {
  width: 100px;
  height: 100px;
  background-color: blue;
  outline: none;
  cursor: pointer;
  color:#FFF;
  display:block;
}

.hiddendiv {
  display: none;
  height: 200px;
  background-color: green;
}

.clicker:focus+.hiddendiv {
  display: block;
}
.hidden{
  margin-left:-99999px;
}
input#cmn-toggle-7:checked + label + div{
 display:block;
}

  
  Click me