DTD선언으로 중앙정렬 참고사항

DTD선언으로 중앙정렬 참고사항 정보

DTD선언으로 중앙정렬 참고사항

본문

그누보드 사이트 내에서 중앙정렬을 찾아서 자료 검색해보니
마땅한 내용이 없어서 직접 찾아보다가 참고 사항으로 내용을 기록합니다

하위내용도 중앙정렬을 포함 내용이라서 링크삽입
http://sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=20744&sca=&sfl=wr_subject&stx=%EC%A4%91%EC%95%99%EC%A0%95%EB%A0%AC&sop=and

CSS내에서 직접 중앙정렬하기 위해서 적용해보다가 DTD선언에 있어서 문제를 확인했네요

head.sub.php 파일에서 Line 46 입니다


주석처리된 DTD선언문으로 인하여 margin: 0 auto; 의 CSS가 적용되지 않아서
주석문을 변경하였습니다 (IE8 에서 확인된 사항입니다)

변경중에서 확인된 내용은 오페라/사파리/불여우/크롬 모두 DTD선언문 없이도 혹은 주석문 처리하에서도
정상적으로 CSS 내용대로 중앙정렬되지만
IE8에서는 주석문때문에 style.css를 직접 수정하여도 적용되지 않습니다

혹 저처럼 중앙정렬에 애먹지 마시고 주석문을 수정해주시면 IE에서 원활히 중앙정렬 확인되실겁니다

IE 를 제외한 브라우져는 CSS적용후 정상 중앙정렬됩니다
IE를 사용하시려면 아래와 같이 선언문을 변경하세요

변경전 head.sub.php 파일에서 Line 46

<html>

변경후 head.sub.php 파일에서 Line 46
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

IE를 포함한 대부분의 브라우져에서 CSS 적용한 magin: 0 auto; 정상적으로 중양정렬 확인 되실겁니다

댓글 7개

아침안개 자기소개 아이디로 검색 회원게시물

자기소개 아이디로 검색 회원게시물

11.03.17 20:36:09

좋은 팁 감사해요

웃는하루 홈페이지 자기소개 아이디로 검색 회원게시물

홈페이지 자기소개 아이디로 검색 회원게시물

11.03.20 16:46:27

하지만 quicks 모드로 이미 작업된 사이트에선
dtd 적용 후 조금씩 어긋나는 부분을 수정할 여건이 안되면 문제가 발생합니다.
(잘 만들었다면 큰 문제는 아니겠지만 대부분 그렇지 못한 경우죠)
그때는 상위 엘리먼트(div로 하나 더 싸거나 body)에 text-align: center;를 적용하고
그 하위에 text-align: left;를 적용하면 됩니다.
물런 하위에는 width가 반드시 지정되있어야 합니다.

삼관왕 자기소개 아이디로 검색 회원게시물

자기소개 아이디로 검색 회원게시물

11.03.27 09:02:18

그누보드는
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

보다는

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">

이게 바람직 합니다.
이것도 웹표준 유효성 검사하면 에러 수백개 많이 뜹니다. ^^