[html] table의 td 너비를 독립적으로 지정할 순 없나요?

Question

table 태그로 간단한 로그인 박스를 만들었습니다.

최상단 '로그인' 부분은 colspan="2" 줬구요.

아이디 너비에 로 지정하니 아래쪽 비밀번호 너비도 자동으로 따라가더군요.

근데 문제는 최하단에 위치한 태그의 너비값까지 아이디에 지정해 준 너비값을 따라가버린다는 겁니다.

최하단 태그 두 개를 정확히 반으로 가르고 싶은데 최하단 태그에 아무리 width값을 줘봐도 변하질 않더라구요.

아이디와 비밀번호칸에 너비를 주는 게 아니라 colspan="3"을 줘서 버튼까지 총 네 칸으로 구분하고,

최하단의 첫번째 태그에 colspan="2"를 주면 반으로 갈라지지 않을까? 싶었는데도 원하는대로 안 됩니다;;

사실 구지 반으로 갈라야 할 필요는 없지만, 그래도 모르고 넘어가는 것 보다야 낫겠다는 마음에 여쭈어봅니다.

원하는 셀만 독자적으로 너비값을 줄 수 있는 방법은 없는지요?

guyv · Answer

테이블은 원하는 셀만 독자적으로 너비를 줄 수는 없습니다.

이렇게 하나 더 잘라서 파란색을 합치는 방법으로 갈 수 있겠네요.

각 행에서 가장 많이 나오는 td 갯수로 잘게 자른 후 합치면 쉽게 구현될겁니다.

ps. 그림에서는 로그인버튼이랑 입력란이랑 사이에 빨간줄 그거야 되는데 빠졌네요.

말씀하신 테이블은 tr, td를 3x4 로 구성해서 합쳐주시면 되겠습니다.

basscraft · Answer

윗분이 말씀하신 것 처럼 하시거나

맨아래 tr속 td에 colspan="2" 로 주시고

td 안에다 table를 하나 더 만드시고 두개의 td에 넓이를 각각 50%씩 주는 방법도 있지만...

이렇게 하는경우 간단하긴 하지만 table 테두리가 겹쳐서 style을 잘 만져서 테두리가 곂쳐보이지 않도록 해야 합니다.

녹차맨 · Answer

답변 모두 감사드립니다.

허나 제 실력이 미천하여 일러주신대로 해보아도 적용이 안 되네요 ㅠ

뭐... 급한 것도 아니니 다음에 좀 더 건드려봐야 할 듯 ㅎㅎ

암튼 답변 감사드립니다.

basscraft · Answer

guyv 님이 적으신 글에 대한 내용을 코딩으로 하면


  
    
    
    
  
  
    로그인
  
  
    
      
    
    
      
    
  
  
    
      
    
  
  
      아이디/비밀번호 찾기
      회원가입

이런 모양이 되겠네요

녹차맨 · Answer

basscraft// 와~! 감사합니다!! 직접 코딩까지 해주시고... ㅠ 실행해보니 원하는 모양으로 찍히네요. 배워갑니다.

5개의 답변