Создание раздела правильного размера в HTML5

Question

Создание раздела правильного размера в HTML5

0

Я изучаю HTML5. Я пытаюсь создать раздел в браузере, который является определенным размером, и в нем помещаются такие вещи, как текст кнопок и т.д., В зависимости от того, какая кнопка нажата. Беда в том, что я не могу сделать секцию меньшей, чем экран, или начать заданную сумму ниже заголовка, так что у нее есть "граница" вокруг него, показывая фоновое изображение. Вот HTML5 у меня есть

    <body>
<header>
    <nav id="nav1">
        <button id="b1"> Goals </button>
        <button id="b2"> Habits </button>
        <button id="b3"> Diary </button>
    </nav>
</header>
<section id="goals">

</section>

Вот CSS, который у меня есть для раздела

   section
   {
height: 700px;
background-color:blue; 
overflow:auto;
top:50px;
transform:translateY(20px);

   }

ProgrammingRookie 15 апр. 2014, в 15:50

Источник

1

Посмотрите на свойства min-height и max-height в CSS, чтобы начать правильный путь.
TylerH 15 апр. 2014, в 13:36
0

Супер ура использовали их и установили маржу и позицию относительно и работали очень хорошо.
ProgrammingRookie 15 апр. 2014, в 13:43

Теги:

html

css

html5

2 ответа

Ещё вопросы

Посмотрите на свойства min-height и max-height в CSS, чтобы начать правильный путь.
Супер ура использовали их и установили маржу и позицию относительно и работали очень хорошо.

Slugge · Answer 1 · 2014-04-15T11-57-00.000Z

http://jsfiddle.net/wcpkM/

см. этот скрипт, а также посмотрите комментарий @TylerH.

Когда используешь

top: 50px;

как и вы, вам либо нужна позиция: абсолютная, относительная или фиксированная. Не рекомендовал бы это делать, если не было абсолютно необходимо.

Это здорово, я впервые увидел, что JSFiddle помогает продвигаться вперед.

jonode · Answer 2 · 2014-04-15T11-09-00.000Z

Вместо top:50px do margin-top: 50px. Top: 50px будет работать только в том случае, если у вас есть position: правило.

Ваша проблема с размером зависит от того, что вы не определили ширину.