[CSS]div 박스 크기 고정하는 법(max-width 안먹힐때)

2023. 1. 28.·강의정리들/[2023] FullStack
반응형

max-with 를 일정 픽셀로 잡아놔도

padding 크기가 커질경우 해당 픽셀보다 박스가 커지는 경우가 있다.

 

이는 width 가 박스의 크기가 아닌 컨텐츠 영역의 크기만을 나타내기 때문이다.

( box-sizing : content-box 가 디폴트로 깔려있음 )

이를 해결하기 위해서는 max-width 설정과 더불어

box-sizing : border-box;

위 속성을 추가해야 함 

반응형
저작자표시 (새창열림)

'강의정리들 > [2023] FullStack' 카테고리의 다른 글

Table  (1) 2023.01.29
form 과 input  (0) 2023.01.29
[CSS]margin 없이 이동하기 / position  (1) 2023.01.28
[CSS]마진 겹칠 때 해결 방법 margin collapse  (0) 2023.01.28
[CSS]selector .셀렉터 문법  (0) 2023.01.28
'강의정리들/[2023] FullStack' 카테고리의 다른 글
  • Table
  • form 과 input
  • [CSS]margin 없이 이동하기 / position
  • [CSS]마진 겹칠 때 해결 방법 margin collapse
keartt
keartt
shalpha_2@naver.com
주니어 탈출일기 🐽
shalpha_2@naver.com
  • keartt
전체
오늘
어제
  • 전체보기
    • CS & 알고리즘
      • CS (컴과학)
      • 알고리즘
      • 백준
    • Spring
      • SpringBoot (JPA)
      • Spring (Legacy)
    • Server
      • Linux
      • Docker
    • Java
      • Design Pattern
    • PostgreSQL
    • GIS (공간정보)
    • 오류정리
    • Git
    • JavaScript
      • Node.js
      • React
    • Tool
      • IntelliJ
      • MacOS
      • VSCode
      • Eclipse
      • Other
    • 강의정리들
      • [2023] FullStack
      • [2022] Spring Boot
      • [2021] Spring Boot

인기 글

태그

이분탐색
브루트포스
구간합
코딩애플
반응형
hELLO· Designed By정상우.v4.6.1
keartt
[CSS]div 박스 크기 고정하는 법(max-width 안먹힐때)

개인정보

kearttshalpha_2@naver.com계정관리

운영중인 블로그

주니어 탈출일기쓰기블로그 관리

이동링크목록

  • 티스토리 홈
  • 피드
  • 로그아웃
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.