답글 : CSS Text Button Design.

익명가 만듬

익명 — Fri, 15 Jul 2011 02:08:19 +0000

좋은 내용 감사 합니다~~

정찬명가 만듬

정찬명 — Tue, 05 Apr 2011 16:19:25 +0000

@이래영
이상 현상이 발생하는 페이지의 URL을 공유해 주시면 한번 확인해 보겠습니다.

이래영가 만듬

이래영 — Tue, 05 Apr 2011 02:48:20 +0000

항상 좋은자료 감사합니다~
그런데 html에서는 이상없이 잘 표현이 되는데요^^
서버에서 돌리게 되면 버튼앞에 스크롤하나정도의 여백이 생기네요..
overflow:visible; 속성을 지우면 괜찮아지고..
원인이 무엇인지 알수가 없어요 ㅜㅜ
그대로 쓰는게 맞는거 같은데..
답변주시면 정말 감사하겠습니다~~

정찬명가 만듬

정찬명 — Thu, 05 Aug 2010 08:50:38 +0000

@이시혜
도움이 되셨다니 기쁘네요. 더 나아가 최근에는 CSS3 만으로도 이런 버튼을 만들 수 있답니다. ^^
http://www.zurb.com/article/266/super-awesome-buttons-with-css3-and-rgba
http://webdesignledger.com/tutorials/12-excellent-css3-button-and-menu-techniques

이시혜가 만듬

이시혜 — Thu, 05 Aug 2010 02:41:15 +0000

css 초보 인데,
버튼을 이미지로 쓰다가, 이건 아닌거 같아서 ^^;;
구글링 해서 찾아오게 됐어요!

정말 많은 도움이 되었습니다. 감사합니다! ^^

정찬명가 만듬

정찬명 — Wed, 09 Jun 2010 11:11:54 +0000

@김현미
혹시 overflow:visible 속성을 지우신건 아닌지요? overflow:visible 속성을 지우면 말씀하신 것과 동일한 현상이 발생하거든요. 여기서 overflow:visible 속성은 꼭 필요한 속성은 아니지만 IE에서 문자열 길이에 비례하여 버튼의 좌우 너비가 커지는 문제를 해결하기 위하여 필요합니다. 이 문제가 아니라면 URL을 남겨주세요. 확인해 보겠습니다.

P.S. 댓글 수정 삭제를 하려면 비밀번호 입력을 받아야 하는데요. 대부분의 분들이 수정 삭제는 사용하지 않는 기능이라서 빠져 있답니다. 수정 삭제는 제가 수동으로 해드릴께요. ^^

김현미가 만듬

김현미 — Wed, 09 Jun 2010 08:12:00 +0000

덧글 수정 삭제 안되네요 ㅜ.ㅜ 두개가 올라가졌네용 이론~

김현미가 만듬

김현미 — Wed, 09 Jun 2010 08:11:01 +0000

제가 여기 css로 버튼에 적용했는데요.
display:-moz-inline-stack; display:inline-block; text-decoration:none

이 부분 때문인지
ie8.0은 텍스트 양쪽끝의 여백이 잘 나오는데 ie7.0에서는 버튼에서 텍스트를 넣었을때
글자 양쪽끝의 여백이 조금 더 넓게 나오더라구요.
버튼의 갯수가 많아서 여백을 줄여야하는데 어떻게 하나요??
나라디자인 파일을 ie7.0에서 열었을때는 똑같이 나오는데 -.-;;

정찬명가 만듬

정찬명 — Mon, 12 Apr 2010 15:19:48 +0000

@란설
저는 이런건 버그 축에도 안끼워 줍니다. ㅎㅎ (어쩔 수 없다에 한 표요!)

란설가 만듬

란설 — Mon, 12 Apr 2010 15:03:19 +0000

아뇨~ 따로 배경이미지 바꾸게 하도록 변경하진 않았는데! 깜박거리면서~ 모래시계도 계속 보여요! 계속 이미지를 읽어오는것처럼!
ie6에서 이 페이지 열어서 확인해봤는데~ button이나 input은 그런 현상이 없는데 a태그만 유독 그러네요~ ^^;
ie6버전에 따라 또 틀린가봐여! 다행이 어드민쪽이라서 그냥 버그라서 어쩔 수 없다고 밀고 나갈려고 하는데~
왜 클라이언트들은 ie6을 쓰는건지…에휴…ㅋㅋㅋ