구글크롬에서 마진이 적용되지 않습니다. 정보
구글크롬에서 마진이 적용되지 않습니다.
관련링크
http://heroes.yusia.pe.kr/
126회 연결
본문
제 홈페이지입니다.
상단 메뉴를 보시면, 익스플로러와 파이어폭스에선 정상적으로 띄어보이는데,
크롬에선 CSS가 적용이 안된 모습으로 보입니다.
<hr width="<?=$table_width?>" color="#241d16" size="1">
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0" style='margin: 7px 0px 7px 15px;'>
<tr>
<td align="left">
<a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=notice"><font color="#535353" size="2"><strong>공지사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gun"><font color="#535353" size="2"><strong>건의사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=qna"><font color="#535353" size="2"><strong>질문답변</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=free"><font color="#535353" size="2"><strong>자유게시판</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gallery"><font color="#535353" size="2"><strong>갤러리</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=memo"><font color="#535353" size="2"><strong>한줄게시판</strong></font></a>
</td>
</tr>
</table>
<hr width="<?=$table_width?>" color="#241d16" size="1">
소스가 이렇게 됩니다.
다시 한번 말하지만, 구글 크롬 웹브라우저에서만 이래요 ;
상단 메뉴를 보시면, 익스플로러와 파이어폭스에선 정상적으로 띄어보이는데,
크롬에선 CSS가 적용이 안된 모습으로 보입니다.
<hr width="<?=$table_width?>" color="#241d16" size="1">
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0" style='margin: 7px 0px 7px 15px;'>
<tr>
<td align="left">
<a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=notice"><font color="#535353" size="2"><strong>공지사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gun"><font color="#535353" size="2"><strong>건의사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=qna"><font color="#535353" size="2"><strong>질문답변</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=free"><font color="#535353" size="2"><strong>자유게시판</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gallery"><font color="#535353" size="2"><strong>갤러리</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=memo"><font color="#535353" size="2"><strong>한줄게시판</strong></font></a>
</td>
</tr>
</table>
<hr width="<?=$table_width?>" color="#241d16" size="1">
소스가 이렇게 됩니다.
다시 한번 말하지만, 구글 크롬 웹브라우저에서만 이래요 ;
댓글 전체
음. 소스를 전반적으로 훑어보았는데 hr 태그의 랜더링 차이인것 같습니다.
그냥 테이블 레이아웃 코딩 하시는 분이니 거기에 맞게 말씀드리자면
hr 태그의 목적이 그냥 상단 | 탑메뉴 | 컨텐츠 부분의 구분하는 바 라인(bar line)의 역할이라면
위쪽과 아래쪽의 hr 소스를 제거하시고 테이블 태그로 한번더 감싸주세요. 그리고 바깥에 감싸준 테이블의상단과 하단에 보더를 넣고, 보더 색상을 지정해주고, td 태그에 상하단 패딩을 주면됩니다.
(아 자세히 살펴보니, 메뉴테이블에 마진이 제대로 적용안된것도 있네요 . 같이 수정하겠습니다)
-------------- 수정전 -----------------------------------------------------
<hr width="<?=$table_width?>" color="#241d16" size="1">
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0" style='margin: 7px 0px 7px 15px;'>
<tr>
<td align="left">
<a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=notice"><font color="#535353" size="2"><strong>공지사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gun"><font color="#535353" size="2"><strong>건의사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=qna"><font color="#535353" size="2"><strong>질문답변</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=free"><font color="#535353" size="2"><strong>자유게시판</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gallery"><font color="#535353" size="2"><strong>갤러리</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=memo"><font color="#535353" size="2"><strong>한줄게시판</strong></font></a>
</td>
</tr>
</table>
<hr width="<?=$table_width?>" color="#241d16" size="1">
----------------------------------------------------------------------------
--------------- 수정후 ------------------------------------------------------
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0" style="border-top:1px solid #241d16;border-bottom:1px solid #241d16">
<tr>
<td style="padding:7px 0px 7px 15px">
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0">
<tr>
<td align="left">
<a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=notice"><font color="#535353" size="2"><strong>공지사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gun"><font color="#535353" size="2"><strong>건의사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=qna"><font color="#535353" size="2"><strong>질문답변</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=free"><font color="#535353" size="2"><strong>자유게시판</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gallery"><font color="#535353" size="2"><strong>갤러리</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=memo"><font color="#535353" size="2"><strong>한줄게시판</strong></font></a>
</td>
</tr>
</table>
</td>
</tr>
</table>
------------------------------------------------------------------------------
혹시 , 저 상태에서 브라우저에서 표시되는 메뉴 테두리와 안쪽의 메뉴사이의 간격이 의도하신대로 나타나지 않으면, 제가 작성한 이 코멘트의 '수정후' 영역에 테이블태그추가한부분의 td에 있는 스타일의 padding:7px 0px 7px 15px 영역에 있는 수치를 조절하시면됩니다
(아실꺼라 생각되지만 padding: 은 숫자의 왼쪽에서 순서대로 (위,오른쪽,아래,왼쪽) 안쪽여백을 의미합니다.
그냥 테이블 레이아웃 코딩 하시는 분이니 거기에 맞게 말씀드리자면
hr 태그의 목적이 그냥 상단 | 탑메뉴 | 컨텐츠 부분의 구분하는 바 라인(bar line)의 역할이라면
위쪽과 아래쪽의 hr 소스를 제거하시고 테이블 태그로 한번더 감싸주세요. 그리고 바깥에 감싸준 테이블의상단과 하단에 보더를 넣고, 보더 색상을 지정해주고, td 태그에 상하단 패딩을 주면됩니다.
(아 자세히 살펴보니, 메뉴테이블에 마진이 제대로 적용안된것도 있네요 . 같이 수정하겠습니다)
-------------- 수정전 -----------------------------------------------------
<hr width="<?=$table_width?>" color="#241d16" size="1">
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0" style='margin: 7px 0px 7px 15px;'>
<tr>
<td align="left">
<a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=notice"><font color="#535353" size="2"><strong>공지사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gun"><font color="#535353" size="2"><strong>건의사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=qna"><font color="#535353" size="2"><strong>질문답변</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=free"><font color="#535353" size="2"><strong>자유게시판</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gallery"><font color="#535353" size="2"><strong>갤러리</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=memo"><font color="#535353" size="2"><strong>한줄게시판</strong></font></a>
</td>
</tr>
</table>
<hr width="<?=$table_width?>" color="#241d16" size="1">
----------------------------------------------------------------------------
--------------- 수정후 ------------------------------------------------------
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0" style="border-top:1px solid #241d16;border-bottom:1px solid #241d16">
<tr>
<td style="padding:7px 0px 7px 15px">
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0">
<tr>
<td align="left">
<a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=notice"><font color="#535353" size="2"><strong>공지사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gun"><font color="#535353" size="2"><strong>건의사항</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=qna"><font color="#535353" size="2"><strong>질문답변</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=free"><font color="#535353" size="2"><strong>자유게시판</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=gallery"><font color="#535353" size="2"><strong>갤러리</strong></font></a> │ <a href="http://yusia.pe.kr/gb4/bbs/board.php?bo_table=memo"><font color="#535353" size="2"><strong>한줄게시판</strong></font></a>
</td>
</tr>
</table>
</td>
</tr>
</table>
------------------------------------------------------------------------------
혹시 , 저 상태에서 브라우저에서 표시되는 메뉴 테두리와 안쪽의 메뉴사이의 간격이 의도하신대로 나타나지 않으면, 제가 작성한 이 코멘트의 '수정후' 영역에 테이블태그추가한부분의 td에 있는 스타일의 padding:7px 0px 7px 15px 영역에 있는 수치를 조절하시면됩니다
(아실꺼라 생각되지만 padding: 은 숫자의 왼쪽에서 순서대로 (위,오른쪽,아래,왼쪽) 안쪽여백을 의미합니다.
감사합니다..
그런데 저 소스로 대체하고, 여백을 다시 조절해서 보니,
상단메뉴 상하라인이 좌우로 삐죽 튀어나와보이네요..
어떻게 해야하는지 ;;;
그런데 저 소스로 대체하고, 여백을 다시 조절해서 보니,
상단메뉴 상하라인이 좌우로 삐죽 튀어나와보이네요..
어떻게 해야하는지 ;;;
아하 죄송합니다;; 깜빡하고 안적어놨었군요 ㅎㅎㅎ
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0">
위아래테두리말고 안쪽의 테이블에 <?=$table_width?>대신 100% 로 해주세요^^
<table width="<?=$table_width?>" cellspacing="0" cellpadding="0">
위아래테두리말고 안쪽의 테이블에 <?=$table_width?>대신 100% 로 해주세요^^
감사합니다 ^^
해결 되었습니다.
해결 되었습니다.
<font>