HTML and CSS Reference
In-Depth Information
Figure 9-13 The More Information button is now positioned relative to its containing the <div class=”showcase”> ele-
ment.
Unfortunately, vertically centering an element via CSS isn't as straightforward as it could be. There is a
vertical-align property, but it doesn't work in a way you may initially expect—it caught me out to begin with.
Continue with the position property for now and come back to the vertical-align property later in this
chapter along with a hack to make the showcase button vertically centered.
Make the footer stretch across the entire page (regardless of the page size and disrespecting the containing <body>
element):
1. In styles.css, add the following declarations to the #footer rule set:
left: 0;
position: absolute;
width: 100%;
2. Save styles.css.
Search WWH ::




Custom Search