Search Results for '언제나 이상한 IE'


4 POSTS

  1. 2008/04/01 [캐동감] 나를 미치게 하는 PNG by mkyoon
  2. 2008/03/29 IE의 Select 콤보 박스와 CSS 그리고 Encoding by mkyoon
  3. 2007/12/03 Filter - AlphaImageLoader 와 PNG 그리고 Link by mkyoon
  4. 2007/11/27 IE6에서 float DIV사이에 낑긴 absolute DIV가 사라지는 현상 by mkyoon

[캐동감] 나를 미치게 하는 PNG


원래 "개, 캐" 라는 접두어를 싫어한다. (내가 개띠라서 그런거 절대 아니;;)
하지만 정말 사용 안할래야 안할 수가 없는 동감 백배천배만배의 글을 보고야 말았으니-

나를 미치게 하는 PNG - http://html.nhndesign.com/blog/?p=142

어흑 -_ㅠ

ps.
여기에 IE 버그를 더하자면.
AlphaImageLoader를 사용하면 링크가 안먹힌다는거~

Posted by mkyoon

Tag
css, ie, PNG, 뷁, 언제나 이상한 IE
Response
No Trackback , No Comment

IE의 Select 콤보 박스와 CSS 그리고 Encoding


IE에서 지원되는 CSS 목록은 다음에서 확인할 수 있다.

<select>　 http://msdn2.microsoft.com/en-us/library/ms535893.aspx
<option>　 http://msdn2.microsoft.com/en-us/library/ms535877.aspx

그리고 다음 문구도 확인할 수 있다.
- option Object Remarks -
Except for background-color and color, style settings applied through the style object for the option element are ignored. In addition, style settings applied directly to individual options override those applied to the containing SELECT element as a whole.
option 엘리먼트에는 오직 배경색과 글씨색만 바꿀 수 있다는 얘기다.
그래. 원래 IE에는 기대조차 안하고 있었으니 그렇다 치자.

하지만 "신기한" 현상을 목격해버렸..-_-
예제 파일을 만들어 보았으니 같이 함 보십시다.

- 예제 File Link 1 - select_euckr.html (ASCII / EUC-KR)
- 예제 File Link 2 - select_utf8.html (UTF-8)

두개의 문서의 차이는 단 하나. 인코딩-_-

select_euckr.html은 저장할 때 파일형식을 ASCII (notepad에선 ANSI)로 저장했고
select_utf8.html은 저장할 때 파일형식을 UTF-8로 저장했다.
물론 각각 character set(EUC-KR, UTF-8)도 알맞게 넣었다.

그럼 소스코드를 확인해보자.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr 또는 utf-8" />
<title>ASCII / EUC-KR 또는 UTF-8</title>
<style type="text/css">
body { font-family: Tahoma; }
select {
　 　 width: 120px;
　 　 height: 200px;
　 　 padding: 5px;
　 　 background: #ff0;
　 　 color: #f00;
　 　 font-family: Dotum;
　 　 font-size: 12px;
　 　 line-height: 2em;
}
option.test {
　 　 height: 20px;
　 　 margin: 5px;
　 　 padding: 10px;
　 　 background: #000 url(http://mkyoon.tomeii.com/mstar.gif) no-repeat 0 0;
　 　 color: #0ff;
　 　 font-family: Gungsuh;
　 　 font-size: 16px;
　 　 line-height: 2em;
}
</style>
</head>
<body>
<h1>EUC-KR 또는 UTF-8</h1>
<select size="5">
　 　 <option>IE 좀맞을래연</option>
　 　 <option class="test">IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option class="test">IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option class="test">IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option class="test">IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
　 　 <option>IE 좀맞을래연</option>
</select>
</body>
</html>

두개 링크를 각각 IE(6,7다 똑같음-_-)와 FF에서 열어보면 다음과 같다.

- IE -
IE - ASCII EUC-KRIE - UTF-8
스타일 먹은거라곤
select : background-color, color, font-family, font-size, height, width
object : background-color, color 끝.

- FF -
FF - ASCII EUC-KRFF - UTF-8
select : background, color, font-family, font-size, height, line-height, padding, width
object : background, color, font-family, font-size, height, line-height, margin, padding
스타일 다 먹어주시고~ 훗-_-

여기서 끝이 아니라.
IE 스크린샷을 한번 보자. 뭔가 이상하지 않은가.
문서 인코딩 형식을 바꿨다고 저렇게 줄간격이 바뀌어도 되는건가?
IE에선 option은 height도 line-height도 안먹는단 말이다!

이건 뭥미?

Posted by mkyoon

Tag
css, encoding, ie, object, select, 뭥미, 셀렉트박스, 언제나 이상한 IE, 인코딩
Response
No Trackback , No Comment

Filter - AlphaImageLoader 와 PNG 그리고 Link


투명처리된 PNG 파일은 IE 6 에서 회색 바탕으로 나옵니다.
이를 해결하기 위해 PNG를 배경그림으로 넣고
AlphaImageLoader 필터를 씌우는데요.

특수한 경우
필터 먹은 DIV 안에 있는 링크를 아무리 눌러도
클릭이 되지 않는 현상이 생깁니다. (언제나 이상한 IE.)

필터먹인 DIV에
position: relative, absolute 설정을 주면
안에 있는 링크는 무용지물이 되고 맙니다.

해결방법

1. 필터 먹인 DIV에는 position 설정이 없거나 position: static;
2. 그 안에 들어있는 링크(a)에 relative 혹은 absolute 를 주세요.

끗.

Posted by mkyoon

Tag
hack, ie, IE6, link, PNG, 언제나 이상한 IE
Response
No Trackback , No Comment

IE6에서 float DIV사이에 낑긴 absolute DIV가 사라지는 현상


[ float left ]　 [ absolute ]　 [ float right ]

요렇게 나란히 DIV 형제가 세개 있는데
IE6 에서만 absolute 가 사라져버리는 현상입니다.
(IE Developer Toolbar 로 찍어봐도 나오지 않습니다)

absolute DIV 를 float left, right 뒤에 놓고
clear: both; 를 주세요.

그럼 나옵니다.
float 사이에 absolute 는 껴두지 않는것이 상책이겠죠.-_-;

하하하 IE6 너 정말 신기하구나~

Posted by mkyoon

Tag
absolute, float, IE6, 언제나 이상한 IE
Response
No Trackback , No Comment
« Previous : 1 : Next »