overflow: auto not moving side margins

Теперь я создаю страницу индекса HTML HTML, и я не знаю, почему этот CSS не работает. Мой CSS код выглядит следующим образом, и мой HTML код после этого:overflow: auto not moving side margins

body { 
    background-image:url("background.png"); 
    font-family:sans-serif; 
} 

#content { 
    margin:0 auto; 
    overflow:auto; 
    background-color:white; 
    border-radius:10px; 
    width:60%; 
} 

.header { 
    margin:10px; 
} 

.body { 
    margin:10px; 
} 

.footer { 
    margin:10px; 
}

HTML код:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Welcome!</title> 
    <link rel="stylesheet" type="text/css" href="stylesheet.css"> 
</head> 
<body> 
    <div id="content"> 
     <div id="header"> 
      <p>This is the header!</p> 
     </div> 
     <div id="body"> 
      <p>This is the body!</p> 
     </div> 
     <div id="footer"> 
      <p>This is the footer!</p> 
     </div> 
    </div> 
</body> 
</html>

Итак, что в конечном итоге происходит, что overflow: auto не устанавливает боковые поля, но это успешно устанавливая верхнее и нижнее поля. Заранее спасибо.

Кстати, все изображения также находятся в каталоге, и они работают нормально.

источник

2015-10-30 Jack Thomas

Вы используете class селекторов в своих CSS и id атрибутах в своем HTML-коде.

Либо измените свой CSS на #header, #body, и #footer.

Или измените свой HTML код на class="header", class="body" и class="footer".

источник

2015-10-30 19:27:41 Quantastical

И это сработало отлично. Огромное спасибо!! –

overflow: auto not moving side margins

ответ

Смежные вопросы