게시판 글 표와 같이 div를 나누고 싶은데 어떻게 하면 될까요?? 채택완료

글1

 글2

 글3


이런식으로 게시판을 나누어 보고싶습니다.


div나 tr를 어떻게 나누면 이런식으로 게시판 글을 읽어올수 있을까요??

답변 9개

채택된 답변
+20 포인트

이분들 너무 어렵게만 생각하시는데...?

Copy
<style type="text/css">.textT1 div {display:inline-table;width:100%;margin:0;padding:0;}.textC1 div {width:49.8%;border: 1px solid #111; float:left;}.textC2 {border: 1px solid #111;}</style><div class="textT1"> <div class="textC1">  <div>글1</div>  <div>글2</div> </div> <div class="textC2">글3</div></div>

float:left 값을 넣어보세요

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

답변에 대한 댓글 1개

위 그림처럼 딱 붙이고 싶으시면 글3도 c1박스 안에 넣어도 되구요
[code]
<style type="text/css">
.textT1 div {display:inline-table;width:100%;margin:0;padding:0;}
.textC1 div {width:49.89%;border: 1px solid #111; float:left;}
.textC1 .textC2 {width:100%; border: 1px solid #111;}
</style>


<div class="textT1">
<div class="textC1">
<div>글1</div>
<div>글2</div>
<div class="textC2">글3</div>
</div>
</div>
[/code]

틀이 어느정도 잡혔다 싶으면 border없애시고 50%맞춰주시면 될겁니다.

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

2eff77a5a40f05e343aa9f5d25221c82_1508740429_5788.JPG
이런식으로 첫번째줄 위아래가 안맞는데.. 어떻게 해야될까요.. width 값 49.8%로 해보았습니다 

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

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

border: 1px solid #111;


보더가 1px 로 되어 있어서, width: 50% 적용시 칸이 밀리는 현상입니다.

width:49.8% 로 줄이시거나, width:500px 로 고정값을 주시거나, 보더를 제거하시면 될듯 싶어요.


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

답변에 대한 댓글 1개

바꿧는데.. 댓글확인 부탁드립니다!

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

위 주소엔 질문한 내용이 안보이네요? 어느 영역인가요?

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

답변에 대한 댓글 1개

http://hyungsoo17.cafe24.com/g5/bbs/board.php?bo_table=kmlebank&wr_id=1

첫번째 글 들어가면 폼이 나오는데 여기 한번 다시 확인해주시면 감사하겠습니다 ㅜㅜ

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

개발중인 사이트 주소 쪽지 주시면 확인해 보겠습니다.

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

답변에 대한 댓글 1개

http://hyungsoo17.cafe24.com/g5/bbs/board.php?bo_table=kmlebank

입니다

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

2eff77a5a40f05e343aa9f5d25221c82_1508735245_3976.JPG 


이런식으로 되는데


첫번째 두번째 줄을 한줄에 넣고싶은데 안되네요ㅜㅜ


도와주세요

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

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

좋은 방법이 아니라고생각됩니다하지만 구지 하시게다면

https://sir.kr/g5_skin/16143?page=2

참조하시고

새로구성으로 짜면 ..

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

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

<style type="text/css">

.textT1 div {display:inline-table;width:100%;margin:0;padding:0;}

.textC1 div {width:50%;border: 1px solid #111;}

.textC2 {border: 1px solid #111;}

</style>


<div class="textT1">

<div class="textC1">

<div>글1</div>

<div>글2</div>

</div>

<div class="textC2">글3</div>

</div>

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

답변에 대한 댓글 1개

댓글 확인부탁드립니다.ㅜㅜ

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

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

로그인
🐛 버그신고