円が大きくなりますます。
<input type="checkbox" id="hamburger"><!--入力 -->
<label for="hamburger"><!--入力用の図形の作成位置 -->
<div id="container"><!--入れ物 -->
<div class="circle icon"><!-- 円の領域 -->
</div>
</div>
</label>
CSS
*{
margin: 0;/*外縁なし*/
padding: 0;/*内縁なし*/
box-sizing: border-box;/*?*/
}
#container{/*divタグのidに対しての装飾*/
background: tomato;/*円の色*/
display: inline-block;/*枠からはみ出さない*/
border-radius: 50px;/*角を丸く100以上で丸*/
margin: 10px;
position: relative;/*相対場所*/
padding: 50px;
cursor: pointer;/*円内部ではカーソルは指の形*/
}
.circle {/*円の領域の大きさ指定*/
position: relative;/*相対場所*/
width: 100px;
height: 100px;
}