RAMY, LEE - 은은한 조약돌이 되기 위한 정진의 길.

  • 홈
  • 태그
  • 방명록

HTML태그정렬방법 1

[Alignment] inline-block사용하여 여백없이 수평 정렬하기.+ flex 레이아웃 사용.

안녕하세요! 레미입니다. 오늘은 수평정렬에 대한 내용을 가져왔어요. display:inline-block; 실무에서 참 많이 사용합니다. 하지만, 큰 단점 하나를 꼽으라면 자체적으로 3~4 픽셀의 여백을 가지고 있다는 점입니다. 수평 정렬을 시킬 땐 1~2픽셀 차이만 나도 조금 분산되어 보이는 느낌이 드는데요. 3픽셀 이상 차이가 나면 반듯한 느낌을 주기 힘들답니다. 그래서, inline-block으로 지정했을 때 여백을 없애는 방법 3가지+flex layout을 소개해 드리려고 합니다. 위 이미지는 display:inline-block;으로 지정 후, 생기는 3~4픽셀 가량의 여백 예시입니다. 꽤 넓지요? 위 이미지는 아래 소개되는 방법으로 여백을 제거한 예시입니다. 1. float 속성 사용하여 강제..

DEV/CSS 2020.12.24
이전
1
다음
더보기
프로필사진

RAMY, LEE - 은은한 조약돌이 되기 위한 정진의 길.

  • 분류 전체보기 (23)
    • DEV (18)
      • WEB (8)
      • HTML (1)
      • CSS (8)
      • CSS Animation (0)
      • JS (0)
      • 데이터시각화 (0)
      • TIPS (1)
    • 개발영어공부 (0)
    • 정보처리기사시험 (5)
      • 2020-2회차 필기 (5)

Tag

아이폰홈버튼배경, 프론트개발환경, 브라우저상태바제거, 아이폰상태바배경, 걸프설치, 웹url상태바제거, iossafearea, 크롬url상태바제거, a링크href팝업제거, 아이폰safearea, 2020정보처리기사필기, 아이폰노치, removealinkstatusbar, a링크상태바제거, ioshomebutton, 걸프리액트설치, iosstatusbar, a링크url팝업제거, 걸프세팅, ios노치이슈,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2025/05   »
일 월 화 수 목 금 토
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바