HTML and CSS Reference
In-Depth Information
To define the overflow style for the
aside
element:
◗
1.
Return to
cp_styles.css
in your text editor and scroll down the style rule for the
aside
selector near the bottom of the file.
◗
2.
Add the following styles, as shown in Figure 4-70:
height: 450px;
overflow: auto;
Figure 4-70
Setting the height and overfl ow properties
height of the
aside element is
set to 450 pixels
scroll bars are displayed
autom
atically if the content
overflows the space
◗
3.
Save your changes to the file and then reload
cycle.htm
in your Web browser. As
shown in Figure 4-71, a scroll bar is added to the
aside
element.
Figure 4-71
aside element with scroll bar
scroll to view
overflow
content
◗
4.
Verify that you can view the entire list of upcoming events by scrolling through
the contents of the Upcoming Events sidebar.
Trouble?
To scroll through the
aside
element using a mobile device like an iPad,
you must use the two-finger scroll gesture on the contents of the sidebar.