그누보드 QA - css 문의

css 문의

yabuki27 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2018.06.12 13:49:22 조회 3162 (210.♡.♡.110)

본문

http://dreams.phps.kr/
메인 슬라이딩 이미지 아래 기본은 3개의 배너로 되어 있는데요
4개로 했더니 한줄 내려가네요..한줄로 모두 보이게 하려면 css를 어떻게 수정해야 할까요??

#css #이윰빌더

답변 8

ilruo 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2018-06-12 14:51:05 182.♡.♡.178

이 태그 부분( 아까 설명 드린 부분 부모 태그 입니다.) 변경 하셔야 해요

bootstrap.min.css 소스중ㅇ

@media (min-width: 1200px) .contaner{width:1170px}

-->

@media (min-width: 1200px) .contaner{width:1560px}

으로 변경하시면 되요

그리고 아까

col-sm-4 클래스도

col-sm-3 로 변경하시구요

그런데 container 이 클래스명이 다른곳에 같은 명으로 쓰는 경우가 아마 잇어서 오류날텐데 클래스명을 따로 변경하셔서 사용하는게 좋을듯해요

container -> container2 이런식으로요

↳ yabuki27 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2018-06-12 15:20:27210.♡.♡.110

감사합니다. 잘 처리했습니다.

ilruo 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2018-06-12 13:54:24 182.♡.♡.178

설정되어있는 width 값 늘려야 할것같은데 소스를 봐야 알겟같네요; 그 부분 실행하는 스크립트부분이요

yabuki27 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2018-06-12 13:55:54 210.♡.♡.110

해당파일의 소스에요

<?php if (!defined('_GNUBOARD_')) exit; ?>
<style>
/* 섹션 타이틀 */
.ebcontents-sect02 {margin-bottom:60px}
.ebcontents-sect02 .section-title {max-width:1280px;margin:0 auto;padding:60px 0 40px}
.ebcontents-sect02 .section-title:after {content:"";display:block;clear:both}
.ebcontents-sect02 .section-title h3 {float:left;width:40%;margin:0;font-size:40px;line-height:45px;color:#1D4252;font-weight:200}
.ebcontents-sect02 .section-title h3 strong {display:block}
.ebcontents-sect02 .section-title p {float:left;width:60%;margin:0;font-size:18px;line-height:30px;color:#707070;padding:0 30px;border-left:1px solid #ddd;border-right:1px solid #ddd}
/* 섹션 아이템 */
.ebcontents-sect02 .section-item {border-top:5px solid #4fb0df}
.ebcontents-sect02 .section-item a {display:block}
.ebcontents-sect02 .section-item img {max-width:100%;height:auto}
.ebcontents-sect02 .section-content {margin-top:20px}
.ebcontents-sect02 .section-content h4 {font-size:18px;font-weight:bold}
.ebcontents-sect02 .section-content p {margin-bottom:15px;color:#707070}
/* 버튼 */
.ebcontents-sect02 .section-content .btn-more a {display:inline-block;padding:5px 20px;border:2px solid #ccc;color:#707070;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out}
.ebcontents-sect02 .section-content .btn-more a:hover {background:#4fb0df;border-color:#4fb0df;color:#fff}
@media (max-width:1199px){
   .ebcontents-sect02 .section-title {max-width:100%}
   .ebcontents-sect02 .section-title h3 {font-size:35px}
   .ebcontents-sect02 .section-title p {font-size:16px}
}
@media (max-width:991px){
   .ebcontents-sect02 .section-title h3, .ebcontents-sect02 .section-title p {float:none;width:100%}
   .ebcontents-sect02 .section-title h3 {padding-bottom:10px;margin-bottom:10px;font-size:24px;line-height:34px;border-bottom:1px solid #ddd}
   .ebcontents-sect02 .section-title h3 span {display:inline}
   .ebcontents-sect02 .section-title p {padding:0;font-size:14px;line-height:24px;border:0}
}
@media (max-width:767px){
   .ebcontents-sect02 .col-sm-4 {margin-bottom:30px}
   .ebcontents-sect02 .col-sm-4:last-child {margin-bottom:0}
}

.ebcontents {position:relative}
.ebcontents-032-section01-adm-btn {position:absolute;bottom:0;left:0;width:100%;text-align:center;z-index:1}
</style>
<div class="ebcontents ebcontents-sect02">
   <div class="container">
       <div class="section-title">
           <h3>{ecinfo.ec_subject}</h3>
           <p>{ecinfo.ec_text}</p>
       </div>
       <div class="row">
           
           <div class="col-sm-4">
               <div class="section-item">
                   <div class="section-image">
                       
                       <a href="{.href_1}" target="{.target_1}">
                       
                           
                           <img src="{.src_1}">
                           
                       
                       </a>
                       
                   </div>
                   <div class="section-content">
                       
                       <h4>{.ci_title}</h4>
                       
                       
                       <p>{.ci_text}</p>
                       
                        
                       <div class="btn-more"><a href="{.href_1}" target="{.target_1}">자세히 보기</a></div>
                       
                   </div>
               </div>
           </div>
           
           <div class="col-sm-4">
               <div class="section-item">
                   <div class="section-image">
                       <a href="#">
                           <img src="./image/contents_01.jpg">
                       </a>
                   </div>
                   <div class="section-content">
                       <h4>빠르고 편리한 교통 환경</h4>
                       <p>주거 공간에 품격을 높이고 살기 좋은 환경을 원하는 당신께 최상의 품질을 약속하는 이윰이 그 방법을 제시해 드립니다.</p>
                       <div class="btn-more"><a href="">자세히 보기</a></div>
                   </div>
               </div>
           </div>
           <div class="col-sm-4">
               <div class="section-item">
                   <div class="section-image">
                       <a href="#">
                           <img src="./image/contents_02.jpg">
                       </a>
                   </div>
                   <div class="section-content">
                       <h4>쇼핑몰과 편의시설</h4>
                       <p>주거 공간에 품격을 높이고 살기 좋은 환경을 원하는 당신께 최상의 품질을 약속하는 이윰이 그 방법을 제시해 드립니다.</p>
                       <div class="btn-more"><a href="">자세히 보기</a></div>
                   </div>
               </div>
           </div>
           <div class="col-sm-4">
               <div class="section-item">
                   <div class="section-image">
                       <a href="#">
                           <img src="./image/contents_03.jpg">
                       </a>
                   </div>
                   <div class="section-content">
                       <h4>대표 랜드마크 조성</h4>
                       <p>주거 공간에 품격을 높이고 살기 좋은 환경을 원하는 당신께 최상의 품질을 약속하는 이윰이 그 방법을 제시해 드립니다.</p>
                       <div class="btn-more"><a href="">자세히 보기</a></div>
                   </div>
               </div>
           </div>
           <div class="col-sm-4">
               <div class="section-item">
                   <div class="section-image">
                       <a href="#">
                           <img src="./image/contents_03.jpg">
                       </a>
                   </div>
                   <div class="section-content">
                       <h4>대표 랜드마크 조성</h4>
                       <p>주거 공간에 품격을 높이고 살기 좋은 환경을 원하는 당신께 최상의 품질을 약속하는 이윰이 그 방법을 제시해 드립니다.</p>
                       <div class="btn-more"><a href="">자세히 보기</a></div>
                   </div>
               </div>
           </div>
           
       </div>
   </div>

<div class="ebcontents-032-section01-adm-btn text-center hidden-xs">
       <a href="{C.EYOOM_ADMIN_URL}/?dir=theme&pid=ebcontents_form&thema={theme}&ec_code={code}&w=u" target="_blank" class="btn-e btn-e-dark"><i class="fa fa-cog"></i> EB컨텐츠 설정하기</a>
       <button type="button" class="btn-e btn-e-dark popovers" data-container="body" data-toggle="popover" data-placement="top" data-html="true" data-content="
           <span class='font-size-11'>
           <strong class='color-indigo'>좌측 [EB컨텐츠 설정하기 버튼] 클릭 후 아래 설명 참고</strong><br>
           <div class='margin-hr-5'></div>
           <span class='color-indigo'>[설정정보]</span><br>
           1. 컨텐츠 마스터 제목 : Salubrious Primium...<br>
           2. 스킨선택 : busi0032_sect02<br>
           3. 컨텐츠 마스터 설명글 : 주거 공간에 품격을..<br>
           4. 컨텐츠 아이템에서 사용할 링크수 : 1개<br>
           5. 컨텐츠 아이템에서 사용할 이미지수 : 1개<br>
           <span class='color-indigo'>[EB 컨텐츠 - 아이템 관리]</span><br>
           1. EB컨텐츠 아이템 추가 클릭<br>
           2. 대표 타이틀 입력<br>
           3. 섦명문구틀 입력<br>
           4. 연결주소 [링크] #1 입력 (자세히 보기 버튼 출력)<br>
           5. 이미지 #1<br>
           <div class='margin-hr-5'></div>
           - 이미지 비율 900x900 픽셀 이미지 사용<br>
           - EB컨텐츠 아이템 3개에 맞춰 디자인
           </span>
       "><i class="fa fa-question-circle"></i></button>
   </div>
   
</div>

터미네이터정 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2018-06-12 13:58:59 121.♡.♡.114

신고가 접수되어 자동으로 블라인드 된 글입니다.
원글을 보시려면 를 클릭하세요.

lover 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2018-06-12 13:59:29 121.♡.♡.114

신고가 접수되어 자동으로 블라인드 된 글입니다.
원글을 보시려면 를 클릭하세요.

ilruo 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2018-06-12 14:01:27 182.♡.♡.178

아 부트스트랩이시네요

보니깐

<div class="col-sm-4">
               <div class="section-item">
                   <div class="section-image">
                       
                       <a href="{.href_1}" target="{.target_1}">
                       
                           
                           <img src="{.src_1}">
                           
                       
                       </a>
                       
                   </div>
                   <div class="section-content">
                       
                       <h4>{.ci_title}</h4>
                       
                       
                       <p>{.ci_text}</p>
                       
                        
                       <div class="btn-more"><a href="{.href_1}" target="{.target_1}">자세히 보기</a></div>
                       
                   </div>
               </div>
           </div>