css 문의 드립니다.. 상품노출 2줄->3줄
본문
상품목록 스킨에 리스트부분만 반응형 식으로 되어있습니다.
기본 2줄씩 나오는데 3줄씩 나오게 하고싶습니다. css쪽은 잘 알지 못해서
찾아보면서 해보고있습니다..
아래 css 영역이 맞는지 모르겠습니다만 기본 3개로 나오게 수정 가능한지요
크기를 줄여도 줄어든 크기로 2줄씩만 나옵니다..
/* 상품 목록 스킨 10 */
.sct_10{padding:10px 0}
.sct_10 .sct_li {position:relative;float:left;padding:10px 10px 30px;transition: all 0.3s ease;width:25%}
.sct_10 .li_wr{}
.sct_10 .sct_last {margin:0 0 15px !important}
.sct_10 .sct_clear {clear:both;}
.sct_10 .sct_img{margin:0 auto 5px ;position:relative;max-width:300px}
/*.sct_10 .sct_a {display:block;text-decoration:none;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;line-height:20px}*/
.sct_10 .sct_a {display:block;text-decoration:none;font-weight:bold;line-height:20px}
.sct_10 .sct_a img{width:100%;height:auto}
.sct_10 .sct_id {display:block;margin:0 0 5px}
.sct_10 .sct_txt{padding:10px 0 0;margin-bottom:5px;;display:block;}
.sct_10 .sct_txt_wr{max-width:300px;margin:0 auto;position:relative}
.sct_10 .sct_basic {margin:0 0 10px}
.sct_10 .sct_cost {display:block;margin:0 0 5px;font-weight:bold;color:#333;font-size:1.05em}
.sct_10 .sct_cost strike {display:block;margin:0 0 5px;color:#999;font-weight:normal}
.sct_10 .sct_icon_wr {margin-bottom:20px}
.sct_10 .sct_sns {margin:15px 0 0}
.sct_10 li:hover .sct_img img{
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
}
------------------------------- view ---------------------------------------------------
<!-- 상품진열 10 시작 { -->
<ul class="sct sct_10 " >
<li class="sct_li sct_clear">
<div class="li_wr">
<div class="sct_img"><a href="#" class="sct_a"><img src="aaa.jpg" ></a></div>
<div class="sct_txt_wr">
<div class="sct_txt"><a href="#" class="sct_a">상품1</a></div>
<div class="sct_cost">23,900원</div>
<div class="sct_icon_wr"><span class="sit_icon"></span></div>
</div>
<div class="sct_cartop"></div>
</div>
</li>
<li class="sct_li ">
<div class="li_wr">
<div class="sct_img"><a href="#" class="sct_a"><img src="bbb.jpg" ></a></div>
<div class="sct_txt_wr">
<div class="sct_txt"><a href="#" class="sct_a">귀여운 옷입!!</a></div>
<div class="sct_cost">1,000원</div>
<div class="sct_icon_wr"><span class="sit_icon"></span></div>
</div>
<div class="sct_cartop"></div>
</div>
</li>
<li class="sct_li ">
<div class="li_wr">
<div class="sct_img"><a href="#" class="sct_a"><img src="bbb.jpg" ></a></div>
<div class="sct_txt_wr">
<div class="sct_txt"><a href="#" class="sct_a">귀여운 옷입!!</a></div>
<div class="sct_cost">1,000원</div>
<div class="sct_icon_wr"><span class="sit_icon"></span></div>
</div>
<div class="sct_cartop"></div>
</div>
</li>
<li class="sct_li ">
<div class="li_wr">
<div class="sct_img"><a href="#" class="sct_a"><img src="bbb.jpg" ></a></div>
<div class="sct_txt_wr">
<div class="sct_txt"><a href="#" class="sct_a">귀여운 옷입!!</a></div>
<div class="sct_cost">1,000원</div>
<div class="sct_icon_wr"><span class="sit_icon"></span></div>
</div>
<div class="sct_cartop"></div>
</div>
</li>
</ul>
<!-- } 상품진열 10 끝 -->
