모바일 리스트글 출력 세로 정렬을 가로로
본문
http://sir.kr/g4_skin/149165?sfl=wr_subject%7C%7Cwr_content&stx=%EC%A7%80%EC%A0%90&page=1
위에 스킨을 모바일로 바꾸고 있습니다. 주소 이런것들이 세로 정렬을 해버립니다.
<?
// 링크
$cnt = 0;
for ($i=1; $i<=$g4[link_count]; $i++) {
if ($view[link][$i]) {
$cnt++;
$link = cut_str($view[link][$i], 70);
echo "<li><span class=\"branch_span_title\">사이트</span> :";
echo "<a href='{$view[link_href][$i]}' target=_blank>";
echo " <span style=\"color:#888;\">{$link}</span>";
echo " <span style=\"color:#ff6600; font-size:11px;\">[{$view[link_hit][$i]}]</span>";
echo "</a></li>";
}
}
?>
<li><span class="branch_span_title">주 소</span> : <?=$view['wr_3']?></li>
</ul>
</div>
<!-- 내용 출력 -->
<div id="writeContents">
<h6 id="bcontent_view_title">지점소개</h6>
<?
// 두번째 파일 출력
for ($i=1; $i<=count($view[file]); $i++) {
if ($view[file][$i][view])
echo $view[file][$i][view] . "<p>";
}
?>
<?=$view[content];?>
</div>
<?//echo $view[rich_content]; // view_image($view, '0', '') 과 같은 코드를 사용할 경우?>
<!-- 테러 태그 방지용 --></xml></xmp><a href=""></a><a href=''></a>
</td>
</tr>
<? if ($is_signature) { echo "<tr><td align='center' style='border-bottom:1px solid #E7E7E7; padding:5px 0;'>$signature</td></tr>"; } // 서명 출력 ?>
</table>
<? if ($nogood_href || $good_href) { ?>
<div id="good_nogood">
<? if ($nogood_href) { ?>
<a href="<?=$nogood_href?>" target="hiddenframe">비추천(<?=number_format($view[wr_nogood])?>)</a>
<? } ?>
<? if ($good_href) {?>
<a href="<?=$good_href?>" target="hiddenframe">추천(<?=number_format($view[wr_good])?>)</a>
<? } ?>
</div>
<? } ?>
<?
// 코멘트 입출력
//include_once("./view_comment.php");
?>
<div style="height:1px; line-height:1px; font-size:1px; background-color:#ddd; clear:both;"> </div>
<div style="clear:both; height:43px;">
<div style="float:left; margin-top:10px;">
<? if ($prev_href) { echo "<a href=\"$prev_href\" title=\"$prev_wr_subject\">이전글</a> "; } ?>
<? if ($next_href) { echo "<a href=\"$next_href\" title=\"$next_wr_subject\">다음글</a> "; } ?>
</div>
<!-- 링크 버튼 -->
<div style="float:right; margin-top:10px;">
<?=$link_buttons?>
</div>
</div>
<div style="height:2px; line-height:1px; font-size:1px; background-color:#dedede; clear:both;"> </div>
</div>
<script type="text/javascript">
function file_download(link, file) {
<? if ($board[bo_download_point] < 0) { ?>if (confirm("'"+decodeURIComponent(file)+"' 파일을 다운로드 하시면 포인트가 차감(<?=number_format($board[bo_download_point])?>점)됩니다.\n\n포인트는 게시물당 한번만 차감되며 다음에 다시 다운로드 하셔도 중복하여 차감하지 않습니다.\n\n그래도 다운로드 하시겠습니까?"))<?}?>
document.location.href=link;
}
</script>
<script type="text/javascript" src="<?="$g4[path]/js/board.js"?>"></script>
<script type="text/javascript">
window.onload=function() {
resizeBoardImage(<?=(int)$board[bo_image_width]?>);
drawFont();
}
</script>
<!-- 게시글 보기 끝 -->
어디를 수정해야 될까요.. css 파일 올려 봅니다.
/* 공통 */
.a_href { display:inline-block; height:24px; padding:0 10px; border:1px solid #ccc; font-size:12px; line-height:200%; font-family:dotum; }
.a_href:link, .a_href:visited, .a_href:hover, .a_href:active {color:#454545; text-decoration:none;}
.a_href_write { display:inline-block; height:24px; padding:0 10px; border:1px solid #6E2A2A; background-color:#6E2A2A; color:#fff; font-size:12px; line-height:200%; font-family:dotum; }
.a_href_write:link, .a_href_write:visited, .a_href_write:hover, .a_href_write:active{color:#fff; text-decoration:none;}
input.ed { vertical-align:middle; }
/* map */
#canvas {float:left; position:relative; width: 320px; height:400px; margin: 0}
#south {width: 320px; height:400px; position: absolute; top: 0px; left: 0;}
#canvas h2{ padding:0; margin:0; font-size:12px; }
#seoul, #gygg, #incheon, #gangwon, #chungbuk, #chungnam, #daejeon, #sejong, #jeonbuk, #jeonnam, #gwangju, #gyeongbuk, #gyeongnam, #daegu, #busan, #ulsan, #jeju { display: none; position: absolute; height:16px; background-color:#000; color:#fff; padding:2px 5px; text-align:center;}
#seoul{ left:80px; top:75px; }
#gygg{ left:80px; top:45px; }
#incheon{ left:60px; top:75px; }
#gangwon{ left:150px; top:45px; }
#chungbuk{ left:120px; top:145px; }
#chungnam{ left:60px; top:165px; }
#daejeon{ left:80px; top:165px; }
#sejong{ left:70px; top:145px; }
#jeonbuk{ left:60px; top:205px; }
#jeonnam{ left:60px; top:260px; }
#gwangju{ left: 60px; top:260px; }
#gyeongbuk{ left:150px; top:165px; }
#gyeongnam{ left:130px; top:240px; }
#daegu{ left:170px; top:210px; }
#busan{ left:190px; top:250px; }
#ulsan{ left:200px; top:225px; }
#jeju{ left:80px; top:340px; }
#map_right_wrapper{float:left; margin-left:0px; width:340px;}
.map_right_title1 {margin:20px 0 7px 0;}
.map_right_title2 {margin:30px 0 7px 0;}
/* 목록 */
#board_list_wrapper {}
#board_category_ul { list-style:none; font-size:12px; }
#board_category_ul li { float:left; text-align:center; margin:3px 3px 3px 0; border:1px solid #ccc; }
#board_category_ul li a { display:block; width:80px; padding:4px 7px; color:#454545; background-color:#f7f7f7; text-decoration:none; }
#board_category_ul li a#cate_select { background-color:#454545; font-weight:bold; color:#fff }
#search_input_btn { padding:2px 5px; vertical-align:middle; cursor:pointer; background-color:#000; color:#fff; border:1px solid #fff; }
.board_search select {vertical-align:middle;}
.board_search input {vertical-align:middle;}
.board_page a:link, .board_page a:visited, .board_page a:active { display:inline-block; height:24px; padding:0 10px; font-weight:bold; font-size:12px; border:1px solid #ccc; line-height:200%; color:#454545; vertical-align:middle; text-decoration:none;}
.board_list td.branch_img img { width:80px; }
.board_list td.branch_addr{ }
/* 그누보드 기본 스타일 */
.board_list { width:100%; table-layout:fixed; margin:5px 0 0 0; font-size:12px; }
.board_list th { font-weight:normal; }
.board_list th { white-space:nowrap; height:30px; overflow:hidden; text-align:center; }
.board_list th { border-top:2px solid #aaa; border-bottom:1px solid #ccc; background-color:#fafafa; }
.board_list tr.bg0 { background-color:#fafafa; }
.board_list tr.bg1 { background-color:#ffffff; }
.board_list td { padding:.5em; }
.board_list td.num { color:#999999; text-align:center; }
.board_list td.checkbox { text-align:center; }
.board_list td.subject { overflow:hidden; }
.board_list td.name { text-align:center; }
.board_list td.datetime { font:normal 11px tahoma; color:#BABABA; text-align:center; }
.board_list td.hit { font:normal 11px tahoma; color:#BABABA; text-align:center; }
.board_list td.good { font:normal 11px tahoma; color:#BABABA; text-align:center; }
.board_list td.nogood { font:normal 11px tahoma; color:#BABABA; text-align:center; }
.board_list .notice { font-weight:bold; color:#454545 }
.board_list .current { font:bold 11px tahoma; color:#E15916; }
.board_list .comment { font-family:Tahoma; font-size:10px; color:#EE5A00; }
.board_button { margin-top:10px; padding-top:10px; border-top:1px solid #ccc;}
.board_page { clear:both; text-align:center; margin:3px 0 0 0; padding:20px 0; }
.board_page a:link { color:#777;}
.board_search { text-align:center; margin:10px 0 0 0; }
.board_search .stx { height:21px; border:1px solid #9A9A9A; border-right:1px solid #D8D8D8; border-bottom:1px solid #D8D8D8; }
/* 글쓰기 */
#basic_write_title { padding:7px 0; text-align:center; border-top:2px solid #c0c0c0; border-bottom:1px solid #ddd; background-color:#fafafa; }
#basic_board_write { width:100%; border-collapse:collapse; font-size:12px; }
#basic_board_write th { width:70px; height:30px; padding-right:20px; text-align:right; color:#666; }
#basic_board_write td.write_table_line { height:1px; line-height:1px; background-color:#e7e7e7 }
#wr_subject { width:98%; padding-left:0; padding-right:0; } /* 전체 style.css 파일 input.ed 에 padding 값 다시 설정 */
#wr_content { width:98%; clear:both; word-break:break-all; border:1px solid #ccc; }
#kcaptcha_image { width:90px; height:40px; }
#write_btn_wrapper { width:100%; height:30px; position:relative; margin:30px 0 20px 0; border-top:1px solid #ccc; font-size:12px; }
#btn_submit { position:absolute; right:0; top:10px; cursor:pointer; background-color:#000; color:#fff; border:0;}
#btn_list { position:absolute; left:0; top:10px; }
/* 글읽기 */
#basic_view_wrapper { font-size:12px; }
#basic_view_title { margin-bottom:5px; padding:7px 0 7px 10px; font-size:13px; font-weight:bold; border-top:2px solid #c0c0c0; border-bottom:1px solid #ddd; background-color:#fafafa; color:#505050; word-break:break-all;}
#basic_view_table { width:100%; border-collapse:collapse; }
#good_nogood { height:30px; text-align:center; }
#good_nogood a { padding:3px 7px; border:1px solid #ccc; font-size:12px;}
#branch_view_left { float:left; width:140px; padding:5px; border:1px solid #ccc; }
#branch_view_left img { width:140px; }
#branch_view_right { float:left; margin-left:10px; }
#branch_view_right ul { list-style:none; margin:0; padding:0; }
#branch_view_right ul li{ line-height:240%; }
#branch_view_right ul li span.branch_span_title {display:inline-block; width:40px;}
#writeContents { clear:both; padding-top:10px; }
#writeContents h6#bcontent_view_title { margin:10px 0; padding:5px 0; font-size:13px; color:#336699; border-bottom:1px solid #ccc; }
답변 1
여기 width: 값 늘려보세요.
#branch_view_right ul li span.branch_span_title {display:inline-block; width:40px;}
