부트스트랩 | 그리드간에 길이가 틀려 그리드끼리 겹칠 때

무료아이콘 전체게시물 작성일18-01-09 09:29 조회1,139회

본문


그리드간에 길이가 틀려 그리드끼리 겹칠 때 

 

모르는 게 많아서 ㄷㄷ

일일히 메모해둬야 겠다는 ㅠㅠ

 

 

그리드가 겹치는 예

 

56e8fcef1ae352e37c7a2b900ac1da8a_1515457
 

 

겹치는 그리드와 그리드 사이에 아래 코드 추가

<div class="clearfix visible-lg-block"></div>

 

 

적용 후


56e8fcef1ae352e37c7a2b900ac1da8a_1515457
 

위의 그리드 겹침 예는 큰 화면에서 생기는 문제라 lg가 들어 감!!

visible-lg-block 


일단 큰 그리드만 수정해줬는데

순차적으로 md, xs까지 수정해줘야 할 듯 ...

 

아래와 같이 중복으로 써도 되네요

<div class="clearfix visible-lg-block"></div>

<div class="clearfix visible-md-block"></div>

 

​참고주소

http://bootstrapk.com/css/#grid-example-mixed-complete 

 

56e8fcef1ae352e37c7a2b900ac1da8a_1515458
 

 

더 단순하게 float 클리어 시키는 방법

<div class="clearfix">...</div>


비회원도 추천 가능합니다.
유익한 정보였다면, 추천해주세요

추천 12 비추천 0

Css + Html

112개의 게시물
목록
읽기: 1P (1lv), 쓰기: 100P (3lv), 덧글: 10P (2lv), 다운: -10P (2lv)
Css + Html 목록
번호 제목 아이디 날짜 조회수 추천
112 css 에어콘 출판사 메인 콘텐츠 레이아웃 관련링크 무료아이콘 전체게시물 09-13 22 추천: 1
111 css float 중앙 정렬 시키기 무료아이콘 전체게시물 09-11 44 추천: 1
110 css 모바일에서 입력창 input 클릭시 확대되는 거 막기 관련링크 무료아이콘 전체게시물 09-04 21 추천: 1
109 jQuery/java 다양한 사이드바 소스 사이드바 플러그인 관련링크 무료아이콘 전체게시물 09-02 16 추천: 1
108 css 크롬 노란 input 배경 없애기 무료아이콘 전체게시물 08-27 51 추천: 1
107 css input에 입력폼에 글자 미리 넣어두기 무료아이콘 전체게시물 08-25 54 추천: 1
106 css 마진 여백 사용시 %넓이 깨지는 경우와 width100%밀림 깨짐 해결하기 무료아이콘 전체게시물 08-17 95 추천: 1
105 etc 브라우저 별 CSS 핵 관련링크 무료아이콘 전체게시물 08-09 56 추천: 1
104 css 목록(리스트)형식의 css에 텍스트 블릿 사용하기 무료아이콘 전체게시물 08-08 43 추천: 1
103 css 넓이 100%에 25%씩 4개값을 줬는데 줄바꿈 되는 경우 ㅠㅠ 댓글1 무료아이콘 전체게시물 07-17 114 추천: 1
102 부트스트랩 동영상 슬라이드 댓글2 관련링크 무료아이콘 전체게시물 01-20 1294 추천: 16
101 부트스트랩 다중,멀티 스타일시트 우선순위 무료아이콘 전체게시물 01-19 1454 추천: 15
100 부트스트랩 부트스트랩 nav 높이를 높였을 때 다른 div 와 겹치는 현상 무료아이콘 전체게시물 01-17 909 추천: 14
99 부트스트랩 부트스트랩에 swiper로 네이버 터치 스크롤링 메뉴 만들기 관련링크 무료아이콘 전체게시물 01-17 2497 추천: 15
98 부트스트랩 부트스트랩 특정 해상도에서만 보이게 하거나 숨기기 무료아이콘 전체게시물 01-10 1740 추천: 17
게시물 검색