테이블 코딩을 하다 div코딩을하니 오류가 많이 나네요.
다옴
div 코딩을 잘 못다루어서 인지 지금 오류가 많이 나서 문의드립니다.
리블아이콘+썸네일+아이디+날자
코멘트~~~~
이렇게 표현하고 싶은데요.
위 이미지처럼 코딩을 하는데 덧글에 리플을 달면 아래쪽으로 한칸 밀려서요.
css 하고 html을 어떻게 수정해야 할지 문의 드립니다.------------------------------------------------------------------------------------------------------
css
.comment_list{
margin: 10px 0px 20px 0px;
width:720px;
top:0px;
left:0px;
text-align:left;
font-size:14px;
position:relative;
}
.comment_list .thum{
top:10px;
left:12px;
text-align:left;
position:relative;
overflow:hidden;
}
.comment_list .thum_name{
top:0px;
left: 90px;
width: 200px;
text-align:left;
font-size:14px;
position:absolute;
overflow:hidden;
}
.comment_list .thum_text{
top:30px;
left:90px;
width: 600px;
text-align:left;
font-size:14px;
position:absolute;
overflow:hidden;
}
.comment_list .thum_social{
top:10px;
left:0px;
bottom:20px;
width: 200px;
text-align:left;
position:relative;
}
.comment_list .thum_block{
top:10px;
left:0px;
height: 30px;
text-align:left;
position:relative;
background:url(../images/comment_line.png)
}
.comment_list_reply{
margin: 10px 0px 20px 20px;
width:700px;
top:0px;
left:0px;
text-align:left;
font-size:14px;
position:relative;
}
.comment_list_reply .reply{
top:10px;
left:12px;
text-align:left;
position:relative;
overflow:hidden;
}
.comment_list_reply .thum{
top:10px;
left:32px;
text-align:left;
position:relative;
overflow:hidden;
}
.comment_list_reply .thum_name{
top:0px;
left: 110px;
width: 200px;
text-align:left;
font-size:14px;
position:absolute;
overflow:hidden;
}
.comment_list_reply .thum_text{
top:30px;
left:110px;
width: 600px;
text-align:left;
font-size:14px;
position:absolute;
overflow:hidden;
}
.comment_list_reply .thum_social{
top:10px;
left:0px;
bottom:20px;
width: 200px;
text-align:left;
position:relative;
}
.comment_list_reply .thum_block{
top:10px;
left:0px;
height: 30px;
text-align:left;
position:relative;
background:url(../images/comment_line.png)
}html
div class=comment_list
div class=thumimg src=images/comment_thum2.png border=0/
div class=thum_nameb애드워드/b 2012.12.20/div
div class=thum_text전에 광고 통해서 본 적이 있어서 가보고 싶은 전시인데... 기회를 노려 이번엔 꼭 가야겠어요!/div
div class=thum_socialimg src=images/commnet_facebook.png width=32 height=32 border=0/ img src=images/commnet_twitter.png width=32 height=32 border=0/ img src=images/commnet_google.png width=32 height=32 border=0//div
div class=thum_blockimg src=images/comment_line.png width=20 height=10 border=0//div
/div
div class=comment_list
div class=thumimg src=images/comment_thum3.png border=0/
div class=thum_nameb다른엄마/b 2012.12.20/div
div class=thum_text국립현대미술관은 항상 좋은 전시를 하는 거 같네요. tv나 인터넷에 나오면 가봐야지. 하면서 매번 이 핑계 저 핑계대면서 안갔는데.. 이런 이벤트가 .../div
div class=thum_socialimg src=images/commnet_facebook.png width=32 height=32 border=0/ img src=images/commnet_twitter.png width=32 height=32 border=0/ img src=images/commnet_google.png width=32 height=32 border=0//div
div class=thum_blockimg src=images/comment_line.png width=20 height=10 border=0//div
/div
div class=comment_list
div class=thumimg src=images/comment_thum4.png border=0/
div class=thum_nameb공주님/b 2012.12.20/div
div class=thum_text가을 어디갔나? 벌써 쌀쌀한 기운이 느껴지네요...더 추워지기전에 과천한번 가보고 싶어요?싶어요. 이 전시를 기회삼아 다녀오고 싶습니다..!!!!!!!/div
div class=thum_socialimg src=images/commnet_facebook.png width=32 height=32 border=0/ img src=images/commnet_twitter.png width=32 height=32 border=0/ img src=images/commnet_google.png width=32 height=32 border=0//div
div class=thum_blockimg src=images/comment_line.png width=20 height=10 border=0//div
/div
div class=comment_list_reply
div class=replyimg src=images/comment_reply.png border=0/
div class=thumimg src=images/comment_thum5.png border=0/
div class=thum_nameb지나는이/b 2012.12.22/div
div class=thum_text오 멋져요!!!/div
div class=thum_socialimg src=images/commnet_facebook.png width=32 height=32 border=0/ img src=images/commnet_twitter.png width=32 height=32 border=0/ img src=images/commnet_google.png width=32 height=32 border=0//div
div class=thum_blockimg src=images/comment_line.png width=20 height=10 border=0//div
/div
-
콩쑨 2024-02-13
책임지시고 1:!강의라도..?
-
맨삶이 2024-02-13
table 코딩만 하시다가 .. 웹표준은 div 코딩이다... 얘기 하니까 ..
div 로만 .......................................ㅎㄷㄷ
이거.. 어떡ㅎㅏ지 @.@; -
총알탄 2024-02-13
div 난무...ㄷㄷㄷㄷ
윗분 말씀처럼 그냥 처음부터 다시 잡으시길... -
일본어못해요 2024-02-13
감사합니다. 기본이 없이 여기저기 짜집기 해서 만들다 보니 이렇게 되었네요.. ^^;;
다시 만들어보겠습니다. -
아이폰 2024-02-13
float로 하시지..ㅠㅠ position을 너무.. 남발 하셔서.. 어렵네요..
제 방법은.. 댓글 부분을 absolute로 변경해서 강제로 위치 잡는것입니다.
그리고 width랑 height가 잡히지않은 곳에 overflow는.. 심하게 꼬일 소지가 잇습니다...
정말 .. 진짜 좋은 답은.. 처음부터 다시 만드는거요..
저같은 경우엔 이런건..
ul로 컨테이너 잡고
li로 한줄씩 잡으면서
이미지는 div
텍스트는 dd 이런식으로 처리합니다..
d -
해샘찬 2024-02-13
Block과 Inline 자료 찾아보겠습니다.
-
단화한 2024-02-13
리플의 이미지 를 싸고있는 div가 block인데 왜 다음줄에 나온지 못하신다면 Block과 Inline에 차이에 대해서 더 알아보셔야합니다;
-
보미 2024-02-13
헉...마크업..;ㅅ; 웹표준은 의미에 맞게 태그를 써야하는데 ㅠㅠㅠ
-
퍼리 2024-02-13
음. div랑 table의 tr td랑 같은걸로 알아서요.. ^^;;
-
세찬 2024-02-13
웹표준은 거의 모르시나 보내요 ..
div 코딩이라고 해서 죄다 div로 해서 하면 안되죠 ...@.@;;마크업 어쩜 좋노 ㅠㅠ