본문 바로가기

주력 서비스 메뉴

분류

인기 글

최근 글

최근 댓글

최근 걸린글

월별 글보관함

  • 작성월 : 2010/03 등록된 글수 : (3)
  • 작성월 : 2010/02 등록된 글수 : (12)
  • 작성월 : 2010/01 등록된 글수 : (3)
  • 작성월 : 2009/12 등록된 글수 : (1)
  • 작성월 : 2009/11 등록된 글수 : (1)

날짜별 글검색

«   2010/03   »
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31      
본문 내용시작
분류 : 작성날짜 및 시간 : 2009/10/30 14:51

제목 : 빽그라운드와 보더의 만남~



어제있었던 일이다~
위와 같은 이미지가 있다. 페이지마다 옆으로도 늘어나고 아래로도 늘어나야하는 거 때문에,
라운드를 확장성있게 작업을 해야한다.

빨간색테두리로된 부분은 빽그라운드 이미지로 깔고, 파란색테두리로된 부분은 보더선으로 하려고 했다.
그런데 온갖 기술을 총동원해도 익스6이 아랫부분 보더선을 제대로 처리를 못해주었다.
아무리 걷어내고 다시 하고, 쓰지도않던 핵도 써가면서 해밨지만 전혀 통하지가 않았다 ㅠ.ㅠ
사실 이런 마크업은 해본적이 한번도없었다.. 파란색 테두리로된 부분도 그림자효과가 적용되어있어서,
이미지로 처리했었었는데 이번에는 단순히 1픽셀짜리 선으로만 이루어져있었다...


위의 코드들처럼 bg 때문에 싱글 div 를 사용하지않고,



요러쿵 깊이를 지정해서 구조화시켜 처리했는데 망할 익스6에서만 아랫부분 border 선이 지워지지않는다능 ㅠ
아, 무려 5시간을 끙끙되며 초집중했으나, 결국엔 실패 ㅠ.ㅠ
margin:-1px; 를 사용하여 보더선위로 bg가 겹치게끔 하였으나, 도무지 왜 안되는지 이해가 안간다 ㅡㅡ^
예전에 다음 메인에서 이런 디자인으로 했었는데 코드좀 잘 바둘걸 ㅡㅡㅋ
어느새 리뉴얼하면서 둥근모서리를 다 걷어냈다능 ㅡ.ㅠ

보통, 잘안풀리면 담배한까치 입에물며 곰곰히 머릿속에 그려보면 전략이 떠올라서 풀리곤했었는데 이건 안되넹;;
지금은 다른방식으로 일단 처리를 해놨으나 나중을위해서라도 좀더 연구해서 꼭 클리어해야겠다 !!

"앜" 카테고리의 다른 글

작성자 : 치프
2009/10/30 14:51 2009/10/30 14:51

댓글

  1. 작성자 : 황규연 작성일 : 2009/10/30 15:17

    http://oocss.org/module.html 여기도 한번 참고해보시죠..^^

    위의 댓글에 관한 답글입니다.
    1. 작성자 : 치프 작성일 : 2009/10/30 15:32

      워우...혹시 제블로그 글올라오면 바로 규연님한테 실시간으로 전달해주나여?!
      그리고 외국사이트는 어떻게 그리 찾아내세여?!
      제가 본문에 작성한 내용처럼 bg를 표현하기위한 단순한 빈태그를 사용하지
      않는 방식을 원했는데 <b class="tl"></b><b class="tr"></b>
      이런 코드들이 있네여... 그리고 코드가 너무 복잡하고 어려워보여여ㅠ.ㅠ

      아, 저번에 송팀장님에게 듣기로는 고생마니 하셔서 접근성연구소인가
      그쪽부서로 가셨다던데,,ㅎㅎ 화이팅입니당...

  2. 작성자 : 황규연 작성일 : 2009/10/30 15:51

    관련해서 의문이 나서 무진장 찾던 사이트네요..1px버그관련 내용이네요..
    ie6참 우리를 먹여살리면서도 이런거보면 참 밉죠..ㅜㅡ
    http://www.brunildo.org/test/ap_contbox1odd.html
    한rss등록이 되서 그런가보네요..자주 보기도 하죠..하하..
    html과 css는 반비례한다가 원칙입니다..재사용성이냐 품질이냐..고민이 많죠..^^;

    위의 댓글에 관한 답글입니다.
    1. 작성자 : 치프 작성일 : 2009/10/30 17:30

      역시 영문사이트 -..-
      아무튼 언제나 좋은 정보제공 감사드립니다.

      아부지 생신선물로 나이키 신발 사려는데 어케좀 안될가여 ㅋㅋㅋㅋ

  3. 작성자 : 유원곤 작성일 : 2009/10/30 17:15

    저거 쉬울 듯 약간 어려운 난이도 "C" 의 문제 정도 되겠네요 ^^;;
    그림자 없음 더 쉬울텐데 ^^;;;

    꼭 해결하세요~

    위의 댓글에 관한 답글입니다.
    1. 작성자 : 치프 작성일 : 2009/10/30 17:21

      다른브라우저는 다 잘되는데 익스6이 border-bottom 이 안지워지고
      오히려 2px border-bottom 이 생깁니다.
      나중에 첨부소스 업로드하겠습니다. 문제점좀 알려주세여 힝~~

  4. 작성자 : 유원곤 작성일 : 2009/10/30 17:15

    그리고 요즘 님 블로그에서 오픈아이디로 댓글 남기는 게 안되어요;;

    위의 댓글에 관한 답글입니다.
    1. 작성자 : 치프 작성일 : 2009/10/30 17:19

      예전에 글 남기시면 다 스팸으로 들어가더니, 이젠 또
      오픈아이디가 안되시는군요...

      제 블로그는 왜이렇게 안되는게 많을가여 ㅠ.ㅠ

[로그인][오픈아이디란?]

상단으로 이동