jQuery: Как изменить размер блока css?

Question

Работа над заданием, и я не думаю, что это та часть, с которой мы должны иметь проблемы (мы должны работать с кнопками прокрутки, о которых у меня уже есть идея):

"--create a page that displays some paragraphs using the css block style. 
The block size should be too small to display the text in its entirety." 

Я получил кучу текста в DIV с идентификатором = «история» и у меня есть это в моих тегах сценария:

$("#story").css("display", "block"); 

Однако ничто не кажется изменить. Макет остается тем же, и я не могу на всю жизнь выяснить, как изменить размер css блок. Все, что я нахожу, это размер коробки.

Итак, два вопроса: 1. Почему дисплей не меняется, когда я использую .css() для применения «блока» и 2. как вы определяете размер блока css?

Edit: Я попытался добавление:

$("#story").css("height", "20px"); 

но также не показывает никаких изменений.

Редактировать:

Спасибо всем! Все были на месте, и я чувствую себя невероятно глупо. Я не понимал, что переполнение должно было быть установлено до того, как оно применит настройку размера. Как только я положил:

overflow: scroll; 

он начал правильно отображаться. Угадайте, что это то, что я получаю за то, чтобы поставить в один кусок в то время

; р

Answer 1

.css("display", "block") отображает элемент как блочный элемент. По умолчанию div отображается как блок.

То, что вы должны сделать, это указать высоту вручную, либо с помощью CSS:

#story 
{ 
    height: 100px; 
} 

Или, если вы хотите использовать JQuery:

$("#story").css("height", "100px"); 

Если вы хотите, чтобы он прокручивать, добавить это в CSS:

overflow-y: scroll; 

Answer 2

Вы должны дать в явной форме фиксированного width и height в вашем CSS.

Divs (и другие элементы с применяемым display:block) являются текучими и, следовательно, будут расширяться, чтобы содержать все, что им помещено.

Answer 3

1. По умолчанию «div» отображается как блок.
2. Укажите размер блока с параметрами ширины и высоты.