파이어폭스도 마냥 좋은 것은 아닌 것 같습니다. 정보
파이어폭스도 마냥 좋은 것은 아닌 것 같습니다.
본문
불여우 단점에 대해서 언급한 사이트도 보긴 했는데
막상 이런 단점도 있다는 것을 보고나니 불여우도 개선이 필요할 듯 합니다.
제가 미쳐 다른 방법이 있다는 것을 모르는 것일 수도 있지만
일단 sir도 확인하니 div 스타일만으로는 커버를 못하셔서 테이블과 함께 제작하셨더군요.
아래 이미지는 테이블을 쓰지 않고 div 스타일로만 제작된 게시판 스킨에서 나타나는 문제입니다.
혹 다른 편법을 알고 계시면 전수 부탁드리겠습니다.
밑천이 워낙 빈약하다보니 모르는 부분이 아주 많습니다.


IE6 에서는 가지런히 정렬이 되는데 불여우에서는 코멘트 글자 넓이만큼만 표시가 되는 웃지 못할 상황이 발생했습니다.(원래 div가 width 와 height 값을 픽셀로 지정하는 것이 기본이어서 그런 것일까요? 반면 익스는 이런 부분에 있어 보다 융통성이 있어서 제대로 나타는 것이 아닌지 생각됩니다.)
혹 다른 브라우저나 버전에서는 이런 경우 어떻게 되는지 궁금합니다.
막상 이런 단점도 있다는 것을 보고나니 불여우도 개선이 필요할 듯 합니다.
제가 미쳐 다른 방법이 있다는 것을 모르는 것일 수도 있지만
일단 sir도 확인하니 div 스타일만으로는 커버를 못하셔서 테이블과 함께 제작하셨더군요.
아래 이미지는 테이블을 쓰지 않고 div 스타일로만 제작된 게시판 스킨에서 나타나는 문제입니다.
혹 다른 편법을 알고 계시면 전수 부탁드리겠습니다.
밑천이 워낙 빈약하다보니 모르는 부분이 아주 많습니다.


IE6 에서는 가지런히 정렬이 되는데 불여우에서는 코멘트 글자 넓이만큼만 표시가 되는 웃지 못할 상황이 발생했습니다.(원래 div가 width 와 height 값을 픽셀로 지정하는 것이 기본이어서 그런 것일까요? 반면 익스는 이런 부분에 있어 보다 융통성이 있어서 제대로 나타는 것이 아닌지 생각됩니다.)
혹 다른 브라우저나 버전에서는 이런 경우 어떻게 되는지 궁금합니다.
추천
0
0
댓글 15개

불여우단점이라기 보다
div사용시 브라우져마다 보여지는게 다른코드가 있습니다..
div사용시 브라우져마다 보여지는게 다른코드가 있습니다..

핵을 사용해야 된다는 말씀같은데 공부를 더 해야겠습니다.

전후 코드를 못봤지만 아래처럼나와야 정상일겁니다.
DTD부터 확인해보셔야할것같네요
오히려 정상으로 보이는 ie6이 문제있는 걸겁니다
파폭에서 저렇게나오는데 사파리 크롬 오페라 에서 IE6처럼 보일리가 없습니다
IE7,8에서도 호환이 안될거같네요
DTD부터 확인해보셔야할것같네요
오히려 정상으로 보이는 ie6이 문제있는 걸겁니다
파폭에서 저렇게나오는데 사파리 크롬 오페라 에서 IE6처럼 보일리가 없습니다
IE7,8에서도 호환이 안될거같네요

확인결과 DTD는 영향을 주지 않았습니다.
궁금했던 점은 float:left는 계층형 구조를 제대로 표현하니 문제가 아닌데
왜 유독 float:right의 width 값이 텍스트만큼만 표현되느냐입니다.
물론, float으로 띄워서 한 줄에 10개 그 이상도 표현할 수 있겠지만
clear:both가 되었을 때는 가장 마지막 float 값을 auto로 꽉 채우면 보다 효율적으로 홈피 구축이 가능할텐데 이 부분이 아쉽습니다.
궁금했던 점은 float:left는 계층형 구조를 제대로 표현하니 문제가 아닌데
왜 유독 float:right의 width 값이 텍스트만큼만 표현되느냐입니다.
물론, float으로 띄워서 한 줄에 10개 그 이상도 표현할 수 있겠지만
clear:both가 되었을 때는 가장 마지막 float 값을 auto로 꽉 채우면 보다 효율적으로 홈피 구축이 가능할텐데 이 부분이 아쉽습니다.

float 사용을 권해봅니다.
http://www.w3schools.com/css/css_float.asp 예제 참고
float:left; 왼쪽부터
float:rigth; 오른쪽부터
파이어폭스의 단점을 논하는 글 제목과는 상관없는 글이네요.
http://www.w3schools.com/css/css_float.asp 예제 참고
float:left; 왼쪽부터
float:rigth; 오른쪽부터
파이어폭스의 단점을 논하는 글 제목과는 상관없는 글이네요.

물론, 사용을 했지요. 그랬기에 위와 같이 나타나는 것입니다.
float을 사용하지 않으면 위와 같이 계층형 구조를 취할 수 없지요.
여기서 핵심은 div 내에서 텍스트 너비만큼만 표현된다는 것입니다.
float을 사용하지 않으면 위와 같이 계층형 구조를 취할 수 없지요.
여기서 핵심은 div 내에서 텍스트 너비만큼만 표현된다는 것입니다.

Tableless 그누보드 입니다.
http://www.openxml.kr/bbs/board.php?bo_table=community&wr_id=1
여기서 테스트 해보세요.
W3c Validate까지 정확히 통과합니다.
http://www.openxml.kr/bbs/board.php?bo_table=community&wr_id=1
여기서 테스트 해보세요.
W3c Validate까지 정확히 통과합니다.

말씀해주신 사이트 잘 보았습니다.
두 가지 궁금한 것은
첫번째 코멘트 상단의 구글배너 아래 관리자는 글자가 가려지네요.
그리고 현재 댓글을 보시면 댓글 마지막에 또다시 댓글을 달려고보면 div가 올라탑니다. 혹, 이 부분은 해결 못 보셨는지요? textarea width 값을 지정해 놓으셔서 그런 것 같은데 % 변경은 불가능할까요? 저도 아주 고민했던 부분이거든요.
두 가지 궁금한 것은
첫번째 코멘트 상단의 구글배너 아래 관리자는 글자가 가려지네요.
그리고 현재 댓글을 보시면 댓글 마지막에 또다시 댓글을 달려고보면 div가 올라탑니다. 혹, 이 부분은 해결 못 보셨는지요? textarea width 값을 지정해 놓으셔서 그런 것 같은데 % 변경은 불가능할까요? 저도 아주 고민했던 부분이거든요.

좋은지적 고맙습니다.
구글 광고부분은 별도 css로 처리했고
textarea 를 width값에서 80% 정도로 변경해서 수정해봤습니다.
구글 광고부분은 별도 css로 처리했고
textarea 를 width값에서 80% 정도로 변경해서 수정해봤습니다.
저도 스킨 만들면서 비슷한 예가 있었는데 결론은 테이블이나 DIV를 코딩할 때 상대값에 의존을 많이해서 그랬습니다. 의존을하면 완벽하게 구속되도록 추가옵션을 잘활용해야 되는데 그렇지 않아서 브라우저 랜더링방식에 영향을 받은 것이지요.
브라우저끼리 잘안된다는건 브라우저에서 자체적으로 디버깅해준다는 이야기도 되니까 절대로 그대로 두면안되고 반드시 수정하셔야 하는 상황입니다. 이는 개발자가 항상 주의해야하는 부분이구요.
브라우저 랜더링 방식에 따른 차이에 관해 자료를 좀 찾아보세요. 비단 파폭 뿐만이 아니라 사파리, 크롬 모두다 같은 소스로 조금식 다른 반응을 나타냅니다. 그래서 여러브라우저로 테스트해보면서 만들어야 됩니다 ^^(같은 랜더링 엔진을 써도 처리방식이 다른지 랜더링결과도 다르더군요)
브라우저끼리 잘안된다는건 브라우저에서 자체적으로 디버깅해준다는 이야기도 되니까 절대로 그대로 두면안되고 반드시 수정하셔야 하는 상황입니다. 이는 개발자가 항상 주의해야하는 부분이구요.
브라우저 랜더링 방식에 따른 차이에 관해 자료를 좀 찾아보세요. 비단 파폭 뿐만이 아니라 사파리, 크롬 모두다 같은 소스로 조금식 다른 반응을 나타냅니다. 그래서 여러브라우저로 테스트해보면서 만들어야 됩니다 ^^(같은 랜더링 엔진을 써도 처리방식이 다른지 랜더링결과도 다르더군요)

엔진마다 다른 해석과 속도 차이로 인해 개발자들이 많이 애를 먹으시더군요.
참 머리 아픈 구조입니다.
참 머리 아픈 구조입니다.

그래도 파이어폭스는 정이갑니다. 왠지 정직해 보여서리.. 핫~

가끔 너무 정직해서리 탈이지요.
솔직히... 완벽한 브라우저가 어딨겠습니까? ㅠㅠ
사람이 만든건데 (흑)
사람이 만든건데 (흑)

문제는 이용자가 되겠지요.
한국에서 가장 많이 사용하는 브라우저가 IE6인데 정작 해당 브라우저는 표준과 많이 벗어나 있고 표준에 맞추어 제작하면 사용자들이 욕을 할 상황이라 참으로 난감한 상태입니다.
그렇다고 오직 텍스트만으로 게시만할 수도 없으니 여러가지로 복잡한 난제들이 많습니다.
저도 다른 분들이 사용하시는 꽁수로 이 문제를 해결하였습니다.
한국에서 가장 많이 사용하는 브라우저가 IE6인데 정작 해당 브라우저는 표준과 많이 벗어나 있고 표준에 맞추어 제작하면 사용자들이 욕을 할 상황이라 참으로 난감한 상태입니다.
그렇다고 오직 텍스트만으로 게시만할 수도 없으니 여러가지로 복잡한 난제들이 많습니다.
저도 다른 분들이 사용하시는 꽁수로 이 문제를 해결하였습니다.