드롭다운 메뉴 정렬문제... 3시간째 헤매는중입니다 ㅠ 정보
드롭다운 메뉴 정렬문제... 3시간째 헤매는중입니다 ㅠ관련링크
http://joojin.net/new/talk.html
102회 연결
본문
오류가 나는곳의 주소를 알려주시면 더 빠르고 정확하게 답변 받을 수 있습니다.
오류 주소 : http://joojin.net/new/talk.html
안녕하세요. 갓 입문하여 공부할때 쓸 홈페이지 하나 만들어보려고 끙끙대는 초보새내기입니다.
스킨자료실에 있는 드롭다운 메뉴를 제 홈페이지에 맞게 수정하고
include 구문을 통해 테스트 페이지에 적용시켜보았는데
메뉴 이미지들이
가운데 정렬이 되지 않고, 우측으로 삐져나옵니다.
간단히 해결 될 법하면서도 무엇이 문제인지 당췌 모르겠네요...
고수님들의 현답 기다리겠습니다
-------------------------------------------------------
include 한 php 소스
<meta name="generator" content="Namo WebEditor(Trial)">
<body leftmargin="0" marginwidth="0">
<p align="center">
<script type="text/javascript" src="http://joojin.net/new/js/jquery.min.js">
</script>
<script type="text/javascript" src="http://joojin.net/new/js/jquery.droppy.js">
</script>
<script type="text/javascript">
$(function() {
$("#nav").droppy();
});
</script>
</p>
</body>
<style type="text/css">
img { margin:0; padding:0; vertical-align:top; line-height:0; border:0; hspace:0; display:block; }
ul,li { margin:0; padding:0; hspace:0; }
#globalNavi { background:#transparent; margin:0; height: 30px; padding-top: 0px; text-align: center; hspace:0; }
#nav { width: 720px; margin: 0 auto; position: center; line-height:0; text-align: center; hspace:0; }
#nav li { list-style: none; float: left; position: relative; hspace:0; }
#nav ul { display: none; position: absolute; top: 29px; left: 0; hspace:0; }
* html #nav ul { line-height: 0; hspace:0; }
#nav ul li { float: none; }
#nav ul { width: 180px; hspace:0; }
#nav ul ul { top: 0; left: 180px; hspace:0; }
#nav ul a {
display: block;
width: 180px;
background:#transparent;
padding: 15px;
color: #7e7e7e;
border-bottom: 0px solid #FFF;
opacity: 0.7;
filter: alpha(opacity=90);
zoom: 0;
line-height: 0;
}
#nav ul a.hover { background: #transparent; }
/* 異붽? */
#nav a { padding:0px; margin:0px; color:#7e7e7e; }
</style>
<div id="globalNavi">
<ul id="nav">
<li><a href="http://joojin.net/newhome.html"><img src="http://joojin.net/homeimage/buttonHome.png" width="180" height="30" border="0" hspace="0"></a></li>
<li><a href="http://joojin.net/study.html"><img src="http://joojin.net/homeimage/buttonStudy.png" width="180" height="30" border="0" hspace="0"></a>
<ul>
<li><a href='#'>Sub 2-1</a></li>
<li><a href='#'>Folder</span></a>
<ul>
<li><a href='#'>Folder</span></a>
<ul>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Sub</a></li>
</ul>
</li>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Folder</a>
<ul>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Sub</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='#'>Sub 2-3</a></li>
</ul>
</li>
<li> <a href="http://joojin.net/history.html"><img src="http://joojin.net/homeimage/buttonHistory.png" width="180" height="30" border="0" hspace="0"></a></li>
<li><a href="http://joojin.net/talk.html"><img src="http://joojin.net/homeimage/buttonTalk.png" width="180" height="30" border="0" hspace="0"></a></li>
</ul>
</div>
오류 주소 : http://joojin.net/new/talk.html
안녕하세요. 갓 입문하여 공부할때 쓸 홈페이지 하나 만들어보려고 끙끙대는 초보새내기입니다.
스킨자료실에 있는 드롭다운 메뉴를 제 홈페이지에 맞게 수정하고
include 구문을 통해 테스트 페이지에 적용시켜보았는데
메뉴 이미지들이
가운데 정렬이 되지 않고, 우측으로 삐져나옵니다.
간단히 해결 될 법하면서도 무엇이 문제인지 당췌 모르겠네요...
고수님들의 현답 기다리겠습니다
-------------------------------------------------------
include 한 php 소스
<meta name="generator" content="Namo WebEditor(Trial)">
<body leftmargin="0" marginwidth="0">
<p align="center">
<script type="text/javascript" src="http://joojin.net/new/js/jquery.min.js">
</script>
<script type="text/javascript" src="http://joojin.net/new/js/jquery.droppy.js">
</script>
<script type="text/javascript">
$(function() {
$("#nav").droppy();
});
</script>
</p>
</body>
<style type="text/css">
img { margin:0; padding:0; vertical-align:top; line-height:0; border:0; hspace:0; display:block; }
ul,li { margin:0; padding:0; hspace:0; }
#globalNavi { background:#transparent; margin:0; height: 30px; padding-top: 0px; text-align: center; hspace:0; }
#nav { width: 720px; margin: 0 auto; position: center; line-height:0; text-align: center; hspace:0; }
#nav li { list-style: none; float: left; position: relative; hspace:0; }
#nav ul { display: none; position: absolute; top: 29px; left: 0; hspace:0; }
* html #nav ul { line-height: 0; hspace:0; }
#nav ul li { float: none; }
#nav ul { width: 180px; hspace:0; }
#nav ul ul { top: 0; left: 180px; hspace:0; }
#nav ul a {
display: block;
width: 180px;
background:#transparent;
padding: 15px;
color: #7e7e7e;
border-bottom: 0px solid #FFF;
opacity: 0.7;
filter: alpha(opacity=90);
zoom: 0;
line-height: 0;
}
#nav ul a.hover { background: #transparent; }
/* 異붽? */
#nav a { padding:0px; margin:0px; color:#7e7e7e; }
</style>
<div id="globalNavi">
<ul id="nav">
<li><a href="http://joojin.net/newhome.html"><img src="http://joojin.net/homeimage/buttonHome.png" width="180" height="30" border="0" hspace="0"></a></li>
<li><a href="http://joojin.net/study.html"><img src="http://joojin.net/homeimage/buttonStudy.png" width="180" height="30" border="0" hspace="0"></a>
<ul>
<li><a href='#'>Sub 2-1</a></li>
<li><a href='#'>Folder</span></a>
<ul>
<li><a href='#'>Folder</span></a>
<ul>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Sub</a></li>
</ul>
</li>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Folder</a>
<ul>
<li><a href='#'>Sub</a></li>
<li><a href='#'>Sub</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='#'>Sub 2-3</a></li>
</ul>
</li>
<li> <a href="http://joojin.net/history.html"><img src="http://joojin.net/homeimage/buttonHistory.png" width="180" height="30" border="0" hspace="0"></a></li>
<li><a href="http://joojin.net/talk.html"><img src="http://joojin.net/homeimage/buttonTalk.png" width="180" height="30" border="0" hspace="0"></a></li>
</ul>
</div>
댓글 전체

globalNavi에 padding-left 줘서 해결하신것 같네요.
300px 정도 주면 될것 같습니다.
300px 정도 주면 될것 같습니다.
제가 한것은 왠지 야매로 해결한 듯한 느낌이네요...ㅠㅠ
관심 감사드립니다~
관심 감사드립니다~