This is a solution to the Order summary card challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- See hover states for interactive elements
- Live Site URL: Add live site URL here
- Semantic HTML5 markup
- CSS custom properties
블럭의 정렬 방법
- position: absolute; 선언
- top 또는 left 속성을 사용하여 원하는 위치 설정
- margin-top 또는 margin-left 속성을 이용, 블럭의 width와 height 값의 반 픽셀만큼 위치 이동
.block {
width: 50px; height: 50px;
position: absolute;
top: 50%;
margin-top: -25px;
}
- W3Schools - 이 프로젝트에 사용된 모든 property들은 이 사이트 참조
- mjmjmj98.tistory - 구글 폰트 적용 참조
- Website - Soyeong Lee
- Frontend Mentor - @ssoyeong-lee