2013-01-09 2 views
1

나는이 조립 작업을 진행하고 있는데, 첫 번째 링크가 시작되기 전에 웬일인지 40px 왼쪽 여백이 생깁니다. 나는 div에 왼쪽 여백이 없기 때문에 왜 그런 일이 일어나는지 확실하지 않습니다. 물론 화면의 왼쪽면을 완전히 비 춥니 다. ID는 직접 여백 크기를 제어하는 ​​것과 같습니다.내비게이션에 남을 가능성이없는 (원치 않는) 왼쪽 여백

내부에는 jsfiddle 오류가 없기 때문에 jsfiddle을 사용할 수 없습니다. 괜찮아요.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<style type="text/css"> 
body { 
    background-color: #FFF; 
    margin: 0; 
    padding: 0; 
} 
#footer_enhanced { 
    height: 50px; 
    width: 100%; 
    position: fixed; 
    bottom: 0px; 
    line-height: 50px; 
    float: left; 
    background-color: #121212; 
    z-index: 999; 
    margin: 0px; 
    left: 0px; 
} 
#navigation_enhanced { 
    color: #000; 
    margin: 0px; 
    padding: 0px; 
    height: 50px; 
    float: left; 
    clear: both; 
} 
#navigation_enhanced ul { 
    list-style: none; 
    margin: 0; 
} 
#navigation_enhanced li { 
    float: left; 
    line-height: 50px; 
} 
#navigation_enhanced li a { 
    display: block; 
    text-decoration: none; 
    font-size: 1.125em; 
    color: #FFF; 
    margin-right: 0.375em; 
    padding-right: 0.375em; 
    padding-left: 0.375em; 
    letter-spacing: -1px; 
} 
#navigation_enhanced li a:hover { 
    color: #000; 
    background-color: #fff; 
} 
.current { 
    display: block; 
    text-decoration: none; 
    font-size: 1.125em; 
    color: #000; 
    background-color: #fff; 
    margin-right: 0.375em; 
    padding-right: 0.375em; 
    padding-left: 0.375em; 
    letter-spacing: -1px; 
    list-style: none; 
    float: left; 
} 
</style> 
</head> 
<body> 
<div id="footer_enhanced"> 
<div id="navigation_enhanced"> 
<ul> 
<li class="current">home</li> 
<li><a href="#">cat2</a></li> 
<li><a href="#">cat3</a></li> 
<li><a href="#">cat4</a></li> 
<li><a href="#">cat5</a></li> 
</ul> 
</div> 
</div> 
</body> 
</html> 
+0

jsfiddle는 어떤 스타일보다 [CSS 재설정] (http://www.cssreset.com/)을 적용합니다. 아마도 당신도 똑같이해야할까요? – Blazemonger

+0

@Blazemonger 감사합니다! – DC1

답변

2

가 다시 때문에 "원하지 않는"공간이 기본적으로 바이올린에 존재하지 않는 CSS (잘못 정상화로 표시) : 그렇게 말

, 이것은 HTML 파일입니다. 기본적으로 ulpadding-left이지만 jsfiddle은이를 지 웁니다.

ul { 
    padding-left: 0; 
} 
+0

정말 고마워요! 나는 내가 뭔가를 바라보고 있다는 것을 알았다. 그것은 나에게 미치고있는 lol를 몰고 있었다. – DC1