2015-01-10 1 views
0

http://snag.gy/SHcEj.jpg http://snag.gy/3Xk3L.jpg배경색 가져가 바로 문제의 메신저 데

내 메뉴 호버 배경 색상이 UL의 시작 부분에 더 오른쪽의 대신 시작한다는 것입니다 위치하지 않습니다. 다음은 몇 가지 스크린 샷입니다. 이것을 묻는 나쁜 스타일을 유감스럽게 생각합니다. 첫 번째 질문.

<!DOCTYPE html> 
<html lang="nl"> 
<head> 
    <title>Bargain</title> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
</head> 
<body> 
    <div id="banner"> 
     <h3>Bargain</h3> 
     <?php 
      date_default_timezone_set('Europe/Amsterdam'); 
      echo '<p>'; 
      $dag = date('j'); 
      $maand = date('F'); 
      $jaar = date('Y'); 
      $uur = date('G'); 
      $minuten = date('i'); 
      if ($uur >= 0 && $uur <= 24) { 
      echo "Het is vandaag $dag $maand $jaar <br>De tijd is $uur:$minuten"; 
      }; 
      echo '</p>'; 
     ?> 
    </div> 
    <div id="menu"> 
     <ul> 
      <li><b>Home</b></li> 
      <li><b>Over ons</b></li> 
      <li><b>FAQ</b></li> 
      <li><b>Contact</b></li> 
      <li><b>Help</b></li> 
     </ul> 
    </div> 
    <div id="content"> 

    </div> 
</body> 
</html> 




body{ 
    background-color: white; 
} 

#banner p { 
    text-align: left; 
} 

#banner { 
    background-color:#E6E6E6; 
    width: 75%; 
    margin: 0 auto; 
    text-align: center; 
} 

#menu { 
    background-color: #E6E6E6; 
    width: 75%; 
    margin: 0 auto; 
} 

#menu ul li:hover { 
    background-color: #D4D4D4; 
} 

#menu ul { 
    width: 100%; 
    display: table; 
    table-layout: fixed; 
} 

#menu ul li { 
    display: table-cell; 
    width: auto; 
    text-align: center; 
} 

#content { 
    background-color: #E6E6E6; 
    width: 75%; 
    margin: 0 auto; 
    text-align: left; 
    height: 800px; 
} 

답변

2
#menu ul { padding: 0; } 

제거 기본 padding 브라우저

에 의해 주어진

데모 -이 나를 위해 일 http://jsfiddle.net/382v8bcm/

+0

감사합니다! –

+0

환영합니다 내 대답을 수락 할 :) –