css HTML코딩 질문 입니다.
희미한눈물
아래이미지 처럼이 DIV들이 썸네일 처럼 정렬이 되게 하려고 합니다.
코드는 아래와 같습니다.
==========================================================
.description {color: #777777;width:136px;font-size:8pt;text-align:left;background-color:#fff;padding:3px;border-top: 1px solid #666666;margin-top:5px;}
.photoblock_left_tr {width: 932px;margin: 0;padding: 0;}
.photoblock_left_td {width: 932px;margin: 0;padding: 0;display:inline;}
.photoblock_left_div {width: 932px;clear:both;margin: 0;padding: 0;}
.photoblock_left {padding: 22px 10px 20px 0;margin:0;text-align:center;float:left;}
.photoblock_left a:link
{
text-decoration: none;
color: #3a4a88;
font-weight: bold;
}
.photoblock_left a:visited
{
text-decoration: none;
color: #3a4a88;
font-weight: bold;
}
.photoblock_left a:visited
{
text-decoration: none;
color: #3a4a88;
font-weight: bold;
}
.photoblock_left a:hover
{
color: #000000;
text-decoration: underline;
font-weight: bold;
}
.photoblock_left img{
border: 1px solid #d4d4d4;
margin: 0;
padding: 0;
}
table cellspacing=0 cellpadding=0 style=width:930px;border:0;margin: 0 auto;
tr class=photoblock_left_tr
td class=photoblock_left_td
div class=photoblock_left_div /div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_lefta href=링크img src=이미지br
brDownload/abr /div class=description제품명/div/div
div class=photoblock_left_div /div
/td
/tr
===========================================================
근데 위의 코드데로 했더니.. 아래와 같이 나오더군요.
DIV안의 내용양에 따라 DIV높이가 달라져서 이렇게 나오네요....
위의 이미지처럼 정렬되게 하려면 어떻게 해야하죠??
5개씩 DIV로 또 묶는방식 최대한 안하려고 합니다. 왜냐면 중간 중간 업데이트가 자주 될건데.
그러면 그때 마다 줄을 하나씩 다바꿔줘야해서요..
-
징징몬
저같아도 div로하겠네여..
일단 전체하나 감싸고
객체(이미지)부분을 한번더감싸주고(한라인의 높이를 일장하게 유지하기위해) 그렇게해서 플릇트 레프트로 줘서 와이드값이 유동적일때 객체(이미지)들이 사이즈에맞게 정렬이될수있게해줄것같습니다 ㅎㅎ