.circle { position: relative; display: inline-block; width: 80px; height: 80px; border-radius: 50%; background: white; } .circle span { position: absolute; display: inline-block; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width :80px; text-align:center; } h1{color:white;font-size:65px;} body{ background:purple; background-image:url(domonn.png); } div{ display: flex; flex: 1; } p{ color:white;font-size:20px; } tate { -ms-writing-mode: tb-rl; writing-mode: vertical-rl; } main{ flex: 1; } nav{ width: 300px; height:1500px; } footer{ height: 100px; background-color: #ffffff; } .box1{ width:50px; background:white; border-radius:30px; text-align:center; color: #ffffff; }