Я пытаюсь использовать CSS для создания своих страниц. Я хочу, чтобы расти, как это делает контент. Но он, кажется, ограничен размером экрана. Я могу сказать, что этот раздел отличается цветом от родителя. Поэтому в области тела появляется некоторый текст и другой контент.Раздел не динамически растет
scaffold.css.scss
html
{
width: 100%;
min-height: 100%;
}
body {
background-color: #C6C0BA;
color: #636363;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 120%;
line-height: 18px;
max-width: 1000px;
min-height: 100%;
margin: 0 auto;
}
section{
padding: 2%;
max-width: 1000px;
background-color: #f3f3f3;
margin: 0 auto;
min-height: 100%;
}
.....
application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Alpha</title>
<%= stylesheet_link_tag "application" %>
<%= javascript_include_tag "application" %>
<%= csrf_meta_tags %>
<%= stylesheet_link_tag 'screen' %>
</head>
<body>
<div class='logo'>
<img src="assets/SiteHeader.png" class="stretch">
</div>
<header>
<%= render 'shared/navigation' %>
</header>
<section id='content'>
<%= yield %>
</section>
</body>
</html>
Вы также можете потерять ширину и высоту для HTML {}, как предложение. – stackuser10210
Если я удалю определения HTML {} или body {}, высота будет равна только 30px ниже заголовка. –
html и body всегда будут соответствовать полному размеру окна, если вы не установите размер, насколько я знаю. например body {background-color: blue;} даст полную страницу синего цвета без добавления других элементов. Я ошибаюсь? – stackuser10210