스케치북 스킨에서
스크랩 버튼을 따로 넣고 싶어서 추천이 포함된 div 박스 안에 스크랩도 넣었더니...
제가 추천 기능을 쓰고 싶은 게시판이 있고 안쓰고 싶은 게시판이 있어서
스킨 설정에서 추천 버튼을 보이지 않도록 하니까 스크랩 버튼도 함께 안보이더라구요
그래서 아예 따로 스크랩 버튼을 만들었는데 두개가 위 아래로 칸이 다르게 나오더라고요.
그래서 박스 영역에 가로폭 50% 50%로 각각 영역을 주니까 얼추 붙기는 붙는데.....
스크랩 버튼만 따로 나오는 게시판에서는 또 한쪽으로 쏠리네요 ㅠㅠ 왜냐면 전체 가로폭의 50% 를 기준으로 잡다 보니....
현재는 그냥 둘다 float: left; 써넣어서 좌측에 붙게 나오게 해놨는데 이걸 어떻게 중앙으로 나란히 나오게 할 수 있을까요? 추천과 스크랩 버튼이 다 보일때나, 스크랩 버튼만 보일때나.. 다 중앙으로 나오게끔 ㅠㅠ
제가 왕초보 중에 왕초보라서 어떻게 해야할지 감이 안잡힙니다..ㅠㅠ
<!--// Vote -->
<div cond="$mi->votes!='N'" class="rd_vote" style="float: left;">
<a class="bd_login" href="#" onclick="doCallModuleAction('document','procDocumentVoteUp','{$oDocument->document_srl}');return false;"|cond="$is_logged" style="border:2px solid #{$mi->color};color:#{$mi->color};">
<b><i class="fa fa-heart"></i> {$oDocument->get('voted_count')}</b>
<span>{$lang->cmd_vote}</span>
</a>
<a cond="!$mi->votes" class="blamed bd_login" href="#" onclick="doCallModuleAction('document','procDocumentVoteDown','{$oDocument->document_srl}');return false;"|cond="$is_logged">
<b><i class="fa fa-heart"></i> {$oDocument->get('blamed_count')}</b>
<span>{$lang->cmd_vote_down}</span>
</a>
<a cond="$mi->declare" class="blamed declare bd_login" href="#" onclick="doCallModuleAction('document','procDocumentDeclare','{$oDocument->document_srl}');return false;"|cond="$is_logged">
<b><i class="fa fa-phone"></i></b>
<span>{$lang->cmd_declare}</span>
</a></div>
<!-- 스크랩 -->
<div class="rd_scrap" style="float: left;">
<a class="blamed scrap bd_login" href="#" onclick="doCallModuleAction('member','procMemberScrapDocument','{$oDocument->document_srl}');return false;"|cond="$is_logged" style="border:2px solid #{$mi->color};color:#{$mi->color};">
<b><i class="fa fa-external-link"></i></b>
<span>{$lang->cmd_scrap}</span>
</a></div>
<div cond="$mi->votes!='N'" class="rd_vote" style="float: left;">
<a class="bd_login" href="#" onclick="doCallModuleAction('document','procDocumentVoteUp','{$oDocument->document_srl}');return false;"|cond="$is_logged" style="border:2px solid #{$mi->color};color:#{$mi->color};">
<b><i class="fa fa-heart"></i> {$oDocument->get('voted_count')}</b>
<span>{$lang->cmd_vote}</span>
</a>
<a cond="!$mi->votes" class="blamed bd_login" href="#" onclick="doCallModuleAction('document','procDocumentVoteDown','{$oDocument->document_srl}');return false;"|cond="$is_logged">
<b><i class="fa fa-heart"></i> {$oDocument->get('blamed_count')}</b>
<span>{$lang->cmd_vote_down}</span>
</a>
<a cond="$mi->declare" class="blamed declare bd_login" href="#" onclick="doCallModuleAction('document','procDocumentDeclare','{$oDocument->document_srl}');return false;"|cond="$is_logged">
<b><i class="fa fa-phone"></i></b>
<span>{$lang->cmd_declare}</span>
</a></div>
<!-- 스크랩 -->
<div class="rd_scrap" style="float: left;">
<a class="blamed scrap bd_login" href="#" onclick="doCallModuleAction('member','procMemberScrapDocument','{$oDocument->document_srl}');return false;"|cond="$is_logged" style="border:2px solid #{$mi->color};color:#{$mi->color};">
<b><i class="fa fa-external-link"></i></b>
<span>{$lang->cmd_scrap}</span>
</a></div>
댓글 4
style css를
float:left; 으로 하면 되요.
일반적으로 이런 디자인적인 부분은 스샷과 사이트 URL이 있어야 더 정확하게 답변받을 수 있을 것 같은데요.
앗 네! 스샷은 이거고요, 사이트 주소는 비공개 사이트라...ㅠㅠ 여기에 막 올리기 좀 그래서요 ㅠㅠ 이상한 사이트는 아니지만예...
참고로 스크랩 버튼 css는 이렇게 추천 부분을 그대로 베껴놨습니다
.rd_vote{padding-bottom:30px;text-align:center}
.bd .rd_vote a{display:inline-block;width:46px;height:46px;margin:0 8px;text-decoration:none;border-radius:4px;*display:inline;*zoom:1}
.rd_vote a.blamed{border:2px solid #BBB;color:#AAA}
.bd .rd_vote a:hover,.bd .rd_vote a:focus{box-shadow:0 1px 4px rgba(0,0,0,.2)}
.rd_vote b{display:block;padding-top:7px;font:700 17px/1 Arial,sans-serif}
.rd_vote .fa-heart{font-size:13px}
.rd_vote span{font-weight:700;font-size:11px}
/* 스크랩 */
.rd_scrap{padding-bottom:30px;text-align:center}
.bd .rd_scrap a{display:inline-block;width:46px;height:46px;margin:0 8px;text-decoration:none;border-radius:4px;*display:inline;*zoom:1}
.rd_scrap a.blamed{border:2px solid #BBB;color:#AAA}
.bd .rd_scrap a:hover,.bd .rd_scrap a:focus{box-shadow:0 1px 4px rgba(0,0,0,.2)}
.rd_scrap b{display:block;padding-top:7px;font:700 17px/1 Arial,sans-serif}
.rd_vote .fa-external-link{font-size:13px}
.rd_scrap span{font-weight:700;font-size:11px}
일반적으로 코드만 봐서는 중복된 부분의 스타일이 초기화하는 등의 여러가지 요인때문에 생기는 문제일수도 있어서 정확한 답변을 재때 못드립니다 ㅡ.ㅡ