HTML and CSS Reference
In-Depth Information
step-by-step
1.
Open your text editor.
2.
From the Lesson_10 folder, open
tpa.html
.
3.
Place your cursor after
width:100%;
in the
#header
rule and press Enter (Return).
4.
Enter the following code:
text-align: center;
5.
Place your cursor before the closing
</style>
tag and press Enter (Return).
6.
Enter the following code:
.imageRight {
float: right;
padding-bottom: 15px;
padding-left: 15px;}
7.
Place your cursor after the opening
<p>
tag of the first paragraph and before the words
Our Mars portal
.
8.
Enter the following code:
<img src=”images/mars.jpg” alt=”Visit Mars!” width=”200” height=”200”
class=”imageRight” />
9.
Save your file.
10.
In your browser, open
tpa.html
to confirm that the new image is now floated properly, as
shown in Figure 10-7.
FiGure 10-7