container calculation example

by Berat Emre NebioÄźlu

HTML

<div>
  <div>
    <div>
      <div>
        <div>
          <div>
            <div>
              <div>
                <div>
                  <div>
                    <div>
                      <div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

CSS

html, body{
  height: 100%;
  margin: 0;
  padding: 0;
}
div {
  animation: orbit 5s infinite linear;
  border: 1px solid black;
  position: relative;
  width: 80%;
  height: 80%;
  top: 9%;
  left: 9%;
}
@keyframes orbit {
  0% { transform: rotate(0deg) translateY(-10%) rotate(0deg); }
100% { transform: rotate(360deg) translateY(-10%) rotate(-360deg); }
}