div border 테두리 겹침 문제
은율
안녕하세요
초보적인 질문이라 좀 쑥쓰럽네요 ^^;;
(제가 궁금한 점을 이미지로 첨부해봤습니다)
div 로 레이아웃을 짜던중
[1][2][3] 형태의 3단 세로 구조를 만드는 중인데,
디자인상 외곽에 1px의 선이 그어져 있습니다
이를 해결하고자 [1],[2]의 영역을 실제 width보다 1px씩 작게 잡아주고
[3]은 그대로 가는 식으로 만들어봤는데요
고유 영역을 그대로 지키면서 border가 겹쳐져 2px 로 되는것이 아닌 1px로 만들수 있는 방법이 없을까요 ?
한참검색을 하다가 php스쿨에서 top-left-bottom만 border를 적용하고, right는 맨 나중 div로 막으라는 조언이 있던데..
그것말고는 없을지 궁금해서 여쭤봅니다 ^^
다름이 아니라
-
해뜰참
div 를 가로로 배치한다는 얘기는 inline-block을 쓰거나 혹은 float을 쓴다는 얘긴데 그걸 감싸는 div를 만드는게 불필요할 거라고 생각되진 않네요 물론, 디자인 목업을 봐야 정확히 판단할 수 있겠지만요 :)
-
애기
Bee 님 감사합니다 (^^)(__)
1,2,3 을 감싸는 div를 만드는 경우 불필요한 코드가 생성되는건 아닐까 했는데, 운영상, 혹은 구축상에서 효율적으로 관리하게되는 경우도 있는지요 ?
더불어 div를 감싸지 않고 해결하는 방법 알려주신것도 감사드립니다 ^^ -
Addictive
1,2,3 을 감싸는 div를 만들고 border를 준다음 내부 1,2의 오른쪽에 border-right을 주는방법도 있고, 1의 오른쪽과, 3의 왼쪽에 보더를 주는 방법도 있겠네요