HTML and CSS Reference
In-Depth Information
d. For every
input
element, create a style rule to: i) display the element as a block
floated on the left margin; ii) set the font size to
0.9 em
; iii) set the top and bot-
tom margins to
7 pixels
, and the left and right margins to
0 pixels
; and iv) set the
width to
50%
.
e. For every selection list, add a style rule to: i) display the selection list as a block
floated on the left margin; ii) set the font size to
0.9 em
; and iii) set the top and
bottom margins to
7 pixels
, and the left and right margins to
0 pixels
.
f. Set the width of the input box for the
years
field to
50 pixels
.
g. Set the width of the check box for the
call
field to
25 pixels
, displayed only
when the left margin is clear.
h. Set the width of the label directly after the call check box to
auto
, and set the
value of the
clear
style property to
none
.
i. Display the input box for the submit button only when the left margin is clear of
floating objects.
j. For both the submit and reset buttons, create a style rule to: i) set the height to
40 pixels
and the width to
200 pixels
; and ii) set the right margin to
20 pixels
.
k. Set the background color of all input boxes and selection lists to
ivory
when they
receive the focus.
l. If an input box receives the focus and contains a valid value, then display the
background color value
(220, 255, 220)
with the background image
go.png
dis-
played in the bottom-right corner with no tiling. Have the background image con-
tained within the input box.
m.If an input box receives the focus and is not valid, then display the background
color value
(255, 232, 233)
with the background image
stop.png
displayed in the
bottom-right corner with no tiling. Have the background image contained within
the input box.
29. Save your changes to the style sheet file, and then go to the application page on the
Young Notes Web site. Verify that the layout and content of the application form
resemble that shown in Figure AC1-5. Verify that you cannot enter invalid data val-
ues or leave required fields with no value. (Note: On some browsers, you will not be
able to test the validation requirements of the form, and the input box for the
years
field will not appear as a spin box.)
30. Submit your completed files to your instructor, in either printed or electronic form,
as requested.
ending dAtA Files
case1
addcases
application.htm
events.htm
lessons.htm
staff.htm
young.htm
fstyles.css
tstyles.css
ystyles.css
