252 CHAPTER 5 More HTML5
- To see your results, press F5 to start debugging the application.
You should see a nicer-looking calculator interface with a page layout as shown in
Figure 5-18.
FIGURE 5-18 he web calculator with its page layoutTExercise 3: Cleaning up the web calculator
The calculator’s buttons are positioned by keeping them the same size and using <br />
elements for each line of buttons. Although the calculator doesn’t look too bad, the buttons
aren’t in their traditional locations. For example, the clear and clear entry buttons are nor-
mally at the top, whereas the plus and minus buttons are typically on the right. The goal of
this lesson is to reposition the buttons.
In this exercise, you continue with the project from Exercise 2 and modify the default.html
file. The elements of the calculator will be positioned by placing them in a table. There will be
seven rows and four columns.- Open the project from Exercise 2.
If you didn’t perform Exercise 2, you can use the project located in the Exercise 2 Start
folder. - Open the default.html file.