목록으로

쇼핑몰페이지 오늘본상품의 위치를 1000밖으로 옮기고 싶습니다. 채택완료

미자엄마

프로필 보기 이 회원 글보기 이 회원의 댓글보기

11년 전 조회 4,665

답변 2

쇼핑몰페이지 오늘본상품의 위치를 1000밖으로 옮기고 싶습니다.

#영카트5

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

정렬:

채택된 답변

+20 포인트

lacomparte

프로필 보기 이 회원 글보기 이 회원의 댓글보기

11년 전

skin안에 있는 style.css 의 21번째 라인

#stv_list의 css에 "right : -100px;" 을 추가해주세요.

</div>
<div><font color="#222222" face="Consolas, Lucida Console, monospace"><span style="font-size: 12px; line-height: normal">#stv_list {</span></font></div>
<div><font color="#222222" face="Consolas, Lucida Console, monospace"><span style="font-size: 12px; line-height: normal"><span class="Apple-tab-span" style="white-space: pre">	</span>position:absolute;</span></font></div>
<div><font color="#222222" face="Consolas, Lucida Console, monospace"><span style="font-size: 12px; line-height: normal"><span class="Apple-tab-span" style="white-space: pre">	</span>right: -100px;</span></font></div>
<div><font color="#222222" face="Consolas, Lucida Console, monospace"><span style="font-size: 12px; line-height: normal"><span class="Apple-tab-span" style="white-space: pre">	</span>width:88px;</span></font></div>
<div><font color="#222222" face="Consolas, Lucida Console, monospace"><span style="font-size: 12px; line-height: normal"><span class="Apple-tab-span" style="white-space: pre">	</span>border:1px solid #e9e9e9;</span></font></div>
<div><font color="#222222" face="Consolas, Lucida Console, monospace"><span style="font-size: 12px; line-height: normal"><span class="Apple-tab-span" style="white-space: pre">	</span>background:#fff</span></font></div>
<div><span style="font-size: 12px; line-height: normal; color: #222222; font-family: Consolas, 'Lucida Console', monospace">}</span></div>
<div>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 5개

�

미자엄마

프로필 보기 이 회원 글보기 이 회원의 댓글보기

11년 전

정말 감사합니다. 한가지 더 물어 볼게요.
커뮤니티 홈 사이트사이즈를 바꾸고 메인의 aside의 여백을 좀 주려니까 페이지가 깨지는데
전체사이즈는 상단레이아웃과 중간레이아웃 모두 변경해야 겠지요?
aside의 좌 여백은 ?
제가 margin:0 0 0 -1px 과 padding:15px 16px 15px 15px 의 의미를 잘 몰라서요. 순서가 어떻게 되는지를

/* 상단 레이아웃 */
#hd {z-index:4;position:relative;min-width:970px;background:#fff}
.hd_zindex {z-index:10 !important}
#hd_h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#hd_wrapper {position:relative;margin:0 auto;padding:26px 0;width:970px;zoom:1}
#hd_wrapper:after {display:block;visibility:hidden;clear:both;content:""}
/* 중간 레이아웃 */
#wrapper {z-index:5;margin:0 auto;width:970px;border-right:1px solid #dde4e9;border-left:1px solid #dde4e9;zoom:1}
#wrapper:after {display:block;visibility:hidden;clear:both;content:""}

#aside {float:right;margin:0 0 0 -1px;width:210px;border-left:1px solid #dde4e9;background:#fff}

#container {z-index:4;position:relative;float:left;padding:15px 16px 15px 15px;width:728px;min-height:500px;height:auto !important;height:500px;border-right:1px solid #dde4e9;background:#fff;font-size:1em;zoom:1}
#container:after {display:block;visibility:hidden;clear:both;content:""}
#container_title {margin-bottom:20px;font-size:1.2em;font-weight:bold}

�

더호감

프로필 보기 이 회원 글보기 이 회원의 댓글보기

11년 전

모든위치관련 속성은 위,오른쪽,아래,왼쪽 순서입니다.

함축형으로 위+아래,좌+우 이런식으로 두개만 쓸수도있고

위,좌+우,아래 이렇게 쓸수도있습니다.

lacomparte

프로필 보기 이 회원 글보기 이 회원의 댓글보기

11년 전

더호감 님께서 margin, padding 축약형에 대해서 잘 설명해주셨네요 ㅎ
content 와 aside 의 합이 늘리려는 사이즈와 딱 맞아야 해요.
padding 과 margin값은 width 값에 영향을 주거든요.

올려주신 소스보면
#aside 의 width는 210px
#container의 width는 728px 하지만
padding: 15px 16px 15px 15px 입니다.
: 이걸 풀어 쓰면 -> padding-top: 15px; padding-right: 16px; padding-bottom: 15px; padding-left: 15px 이 됩니다.

#container 의 width 값에 padding-left, padding-right 값을 더해줍니다.
: padding은 안쪽으로 컨텐츠를 미는 역할을 하고 그 밀어준 만큼 width와 height가 증가합니다. 즉, 패딩 값만큼 width와 height가 늘어난다고 생각하시면 되요.

더하게 되면

최종 #container의 width값은 728px + 16px + 15px 이죠? 759px 이 됩니다.
그럼~ #aside와 #container 의 width 합이 전체 문서의 width 값이 되는거죠
210px + 759px = 969px 이 되는겁니다.

아마 깨지는 이유는(#aside는 제대로 위치하는데 #container 가 내려가는건가요?) width 값이 맞지 않아서 그럴 수도 있어요. 이 #aside와 #container의 합을 #wapper의 width 값에 넣어주셔야 해요~