게시판 리스트 항목 추가
본문
코드라고는 복붙수준으로 조금씩 알고 있는 초보입니다.
현재 그노보드에 나리야 보드를 사용중입니다. 나리야는 달라진 것이 많아 기존 자료가 안되는 부분이 많은 것 같아 아쉽네요 ㅜㅜ
제목 이름 날짜 조회
보통 이렇게 되어 있는 게시판에서 제목을 2개 항목으로 나누었습니다.
남자 여자 이름 날짜 조회
리스트 제목은 저렇게 되었고, 다행스럽게 남자와 여자의 해당 내용도 wr_1 wr_2 등으로 출력도 잘 됩니다. 그런데 정렬이 너무 어렵네요. ㅜㅜ
남자 여자 이름 날짜 조회
A B
여기서 A는 남자칸에, B는 여자 칸에 나와야 하는데, 위와 같이 왼쪽으로 쏠려나옵니다.
예전 자료를 보면, 어떤 분은 css 파일로 잡아야 한다는 분도 계시고 다양하십니다.
남자 여자 이름 날짜 조회
A B
당연히 이런 구조가 되어야 할 것 입니다. 여기서 A는 남자칸에, B는 여자칸에 출력되려면 어떤 코드를 어떻게 넣어줘야 하나요?
언제나 감사드립니다.
참고로 빨간색이 제가 넣은 코드입니다.
상단
<div class="na-table d-none d-md-table w-100 mb-0">
<div class="<?php echo $head_class ?> d-md-table-row">
<div class="d-md-table-cell nw-5 px-md-1">번호</div>
<div class="d-md-table-cell pr-md-1">
<?php if ($is_checkbox) { ?>
<label class="float-left mb-0">
<input type="checkbox" onclick="if (this.checked) all_checked(true); else all_checked(false);">
</label>
<?php } ?>
남자
</div>
<div class="d-md-table-cell nw-10 pl-2 pr-md-1">여자</div>
<div class="d-md-table-cell nw-10 pl-2 pr-md-1">이름</div>
<div class="d-md-table-cell nw-6 pr-md-1"><?php echo subject_sort_link('wr_datetime', $qstr2, 1) ?>날짜</a></div>
<div class="d-md-table-cell nw-4 pr-md-1"><?php echo subject_sort_link('wr_hit', $qstr2, 1) ?>조회</a></div>
<?php if($is_good) { ?>
<div class="d-md-table-cell nw-3 pr-md-1"><?php echo subject_sort_link('wr_good', $qstr2, 1) ?>추천</a></div>
<?php } ?>
<?php if($is_nogood) { ?>
<div class="d-md-table-cell nw-3 pr-md-1"><?php echo subject_sort_link('wr_nogood', $qstr2, 1) ?>비추</a></div>
<?php } ?>
</div>
</div>
하단
<li class="list-item d-md-table-row px-3 py-2 p-md-0 text-md-center text-muted border-bottom<?php echo $li_css;?>">
<div class="d-none d-md-table-cell nw-5 f-sm font-weight-normal py-md-2 px-md-1">
<?php echo $list[$i]['num'] ?>
</div>
<div class="d-md-table-cell text-left py-md-2 pr-md-1">
<div class="na-title float-md-left">
<div class="na-item">
<?php if ($is_checkbox) { ?>
<input type="checkbox" class="mb-0 mr-2" name="chk_wr_id[]" value="<?php echo $list[$i]['wr_id'] ?>" id="chk_wr_id_<?php echo $i ?>">
<?php } ?>
<a href="<?php echo $list[$i]['href'] ?>" class="na-subject"<?php echo $wr_target ?><?php echo $wr_popover ?>>
<?php
if($list[$i]['icon_reply'])
echo '<span class="na-hicon na-reply"></span>'.PHP_EOL;
echo $wr_icon;
?>
<?php echo $list[$i]['A'] ?>
</a>
<?php echo $list[$i]['B'] ?>
<?php echo $icon_file ?>
<?php if($list[$i]['wr_comment']) { ?>
<div class="na-info">
<span class="sr-only">댓글</span>
<span class="count-plus orangered">
<?php echo $list[$i]['wr_comment'] ?>
</span>
</div>
<?php } ?>
</div>
</div>
</div>
답변 3
code가 적용되서 색삭이 보이지 않네요 ㅜㅜ 상단코드에 남자 여자, 하단 코드에 A B 출력이 있습니다.
다음과 같은 방법으로 시도해 볼 수 있을 것 같습니다.
참고하셔서 원하시는 형태로 구현하시면 될 것 같습니다.
html
<div class="na-table d-none d-md-table w-100 mb-0">
<div class="<?php echo $head_class ?> d-md-table-row">
<div class="d-md-table-cell nw-5 px-md-1">번호</div>
<div class="d-md-table-cell pr-md-1">남자</div>
<div class="d-md-table-cell nw-10 pl-2 pr-md-1">여자</div>
<div class="d-md-table-cell nw-10 pl-2 pr-md-1">이름</div>
<div class="d-md-table-cell nw-6 pr-md-1"><?php echo subject_sort_link('wr_datetime', $qstr2, 1) ?>날짜</a></div>
<div class="d-md-table-cell nw-4 pr-md-1"><?php echo subject_sort_link('wr_hit', $qstr2, 1) ?>조회</a></div>
<?php if($is_good) { ?>
<div class="d-md-table-cell nw-3 pr-md-1"><?php echo subject_sort_link('wr_good', $qstr2, 1) ?>추천</a></div>
<?php } ?>
<?php if($is_nogood) { ?>
<div class="d-md-table-cell nw-3 pr-md-1"><?php echo subject_sort_link('wr_nogood', $qstr2, 1) ?>비추</a></div>
<?php } ?>
</div>
</div>
css 추가
/* 추가한 CSS 스타일 */
.na-table {
display: table;
width: 100%;
table-layout: fixed;
}
.d-md-table-row {
display: table-row;
}
.d-md-table-cell {
display: table-cell;
padding: 5px; /* 적절한 여백 설정 */
}
/* 남자와 여자 열을 나란히 표시하도록 설정 */
.d-md-table-cell:nth-child(2) {
width: 50%; /* 남자 열 너비 설정 */
}
.d-md-table-cell:nth-child(3) {
width: 50%; /* 여자 열 너비 설정 */
}
/* 남자와 여자에 A와 B 표시하기 */
.d-md-table-cell:nth-child(2) a::before {
content: "A ";
}
.d-md-table-cell:nth-child(3) a::before {
content: "B ";
}
상단 table-cell 과 하단 table-cell 이 동일해야 합니다.
