[이윰] modal 창 크기 변경하기
페이지 정보
루루아빠
4,000
2015.07.30 17:45:40
짧은주소
-
https://yadolee.com/tip/264 주소복사
본문
갤러리 뷰에서 모달창과 게시판 문서 검색의 모달창의 크기를 조건에 맞게 반영한다.
그누보드5/eyoom/theme/설치된 테마/css/custom.css를 열고 아래 소스를 삽입한다.
게시판내 문서 검색시 사용하는 모달창 클래스 modal-sm 은 가로, 세로 크기를 고정했다.
그누보드5/eyoom/theme/설치된 테마/css/custom.css를 열고 아래 소스를 삽입한다.
.modal {
position: fixed;
top: 2%;
right: 2%;
left: 2%;
bottom: 2%;
width: auto;
height: auto;
margin: 0;
}
@media (min-width: 1200px) {
.modal-dialog {
width: 100%;
height: 100%;
margin: 0px auto;
}
.modal-sm {
width: 400px;
height: 230px;
}
}
@media (min-width: 1002px) and (max-width: 1199px) {
.modal-dialog {
width: 100%;
height: 100%;
margin: 0px auto;
}
.modal-sm {
width: 400px;
height: 230px;
}
}
@media (min-width: 768px) and (max-width: 1001px) {
.modal-dialog {
width: 100%;
height: 100%;
margin: 0px auto;
}
.modal-sm {
width: 400px;
height: 230px;
}
}
@media (max-width: 767px) {
.modal-dialog {
width: 100%;
height: 100%;
margin: 0px auto;
}
.modal-sm {
width: 300px;
height: 230px;
}
}
.modal-content {
height: 100%;
overflow-x: hidden;
overflow-y: hidden;
}
.modal-body {
height: auto;
}
.modal-title {
margin-top: 0px
}
.modal-header .close {
margin-top: 3px;
}
.modal-footer {
text-align: left;
padding: 11px;
}
게시판내 문서 검색시 사용하는 모달창 클래스 modal-sm 은 가로, 세로 크기를 고정했다.
추천인
레벨 101
경험치 1,519,440
Progress Bar 14.66%
- 가입일 : 2015-03-04 03:24:54
- 서명 : KNOW YOUR LIMITS
BUT NEVER STOP TRYING TO EXCEED THEM !!
- 자기소개 : 루루의 자랑
루루아빠랍니다~~
최신댓글이 없습니다.


댓글
첫 번째 댓글을 남겨 주세요