xhtml 페이지가 IE에서 보이지 않습니다.. ㅠㅠ + CSS

lacovnk의 이미지

http://www.lacovnk.net/snuchoir_new/

validator 돌려보면 This Page Is Valid XHTML 1.0 Strict! 라고 나옵니다. 불여우에서는 잘 보이는데, IE에서는 페이지가 공백이 되어버립니다 - 소스 보기에서는 다 보이는데, 렌더링?이 전혀 안되는군요;

도움 부탁드립니다 ㅎㅎ - 아아, IE 꾸졌어 -_-;;;

어디가 문제일까요? 흑

rapzzard의 이미지

<head>
	<title>서울대 합창단에 오신 것을 환영합니다</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link rel="stylesheet" type="text/css" href="style.css" />
</head>

meta 엘리먼트로 charset이 utf-8로 지정해주기전에..
title엘리먼트내의 데이터가 utf-8로 인코딩되어있기때문에..
기본적으로 euc-kr로 해석하는 바람에 안 보이는겁니다..:D
title과 meta의 위치를 바꾸시면 됩니다..

P.S : 저도 이것때문에 몇일 고민했습니다..:P

hys545의 이미지

lacovnk wrote:
http://www.lacovnk.net/snuchoir_new/

validator 돌려보면 This Page Is Valid XHTML 1.0 Strict! 라고 나옵니다. 불여우에서는 잘 보이는데, IE에서는 페이지가 공백이 되어버립니다 - 소스 보기에서는 다 보이는데, 렌더링?이 전혀 안되는군요;

도움 부탁드립니다 ㅎㅎ - 아아, IE 꾸졌어 -_-;;;

어디가 문제일까요? 흑


인코딩을 utf-8로 하면 잘 보이는데여

즐린

익명 사용자의 이미지

헤더에서 문자셋을 utf-8 으로 보내셔야 됩니다.

lacovnk의 이미지

인코딩을 지정하는 meta 태그를 앞으로 옮겨주니 되는군요 :)

그다음 문제가 생겼습니다;

http://www.lacovnk.net/snuchoir_new/temp.html

위의 주소에서, "뉴스" 테이블을 오른쪽으로 정렬하려고 합니다.

div 안에서, table이 오른쪽에 위치해야 합니다. 그런데, 다음과 같이 하면 되지 않습니다;

(w_100p는 width:100% 속성이고, al_r은 text-align:right 속성입니다 (태그는 지정하지 않은..) )

안되는 코드 :

<div class="w_100p al_r">
	<table class="al_l w_500"> blabla..
</table></div>

혹시나 해서, xhtml에는 없지만, align 속성을 다음과 같이 주니 오른쪽에 딱 붙습니다!!

되는 코드:

<div align="right" class="w_100p">
	<table class="al_l w_500"> blabla...
</table></div>

이상한건, 그럼 css에서 text-align과, 태그 내에 align속성을 같이 주면 또 동작을 하지 않습니다

안되는 코드:

<div align="right" class="w_100p al_r">
	<table class="al_l w_500"> blabla...
</table></div>

이상은 불여우 1.0에서 테스트한 것인데, IE에서는 모두 우측 정렬이 되어서 나타납니다.

lacovnk의 이미지

margin:0 속성이 줘버리니, 그 안의 element가 center로 가고 싶어도 왼쪽에 붙어버린 것 이었습니다 -_-;

center로 정렬될 elemet에 margin:0 auto; 속성을 주니 해결되는군요 :)

right로 보낼 경우에는 margin-left : auto 로 지정해야 확실히 되는군요; (margin:0 auto 는 안되는 듯; )

댓글 달기

Filtered HTML

  • 텍스트에 BBCode 태그를 사용할 수 있습니다. URL은 자동으로 링크 됩니다.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>
  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.

BBCode

  • 텍스트에 BBCode 태그를 사용할 수 있습니다. URL은 자동으로 링크 됩니다.
  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param>
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.

Textile

  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • You can use Textile markup to format text.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>

Markdown

  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • Quick Tips:
    • Two or more spaces at a line's end = Line break
    • Double returns = Paragraph
    • *Single asterisks* or _single underscores_ = Emphasis
    • **Double** or __double__ = Strong
    • This is [a link](http://the.link.example.com "The optional title text")
    For complete details on the Markdown syntax, see the Markdown documentation and Markdown Extra documentation for tables, footnotes, and more.
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>

Plain text

  • HTML 태그를 사용할 수 없습니다.
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.
  • 줄과 단락은 자동으로 분리됩니다.
댓글 첨부 파일
이 댓글에 이미지나 파일을 업로드 합니다.
파일 크기는 8 MB보다 작아야 합니다.
허용할 파일 형식: txt pdf doc xls gif jpg jpeg mp3 png rar zip.
CAPTCHA
이것은 자동으로 스팸을 올리는 것을 막기 위해서 제공됩니다.