Web Design with HTML and CSS

236

Interactivity on the web

Web Design with HTML and CSS Digital Classroom

2 Scroll to the head section of your page and locate the ID style rule we created for you called

#Sl_content. Add the following code to defi ne the width and height of this div:

#Sl_content

{

position:absolute;

left:296px;

top:4px;

width:657px;

height:126px;

}

This code is absolutely positioning the Sl_content div inside the containing footer

div. Also, the width and the height of the div are the exact same pixel dimensions as the

Silverlight content (657 for width and 126 for height).

3 Choose File > Open and in the dialog box that appears, navigate to the

10_generatedSl.html document. This code was created by a Silverlight authoring

program called Expression Blend. In Code view, locate the <object> tag.

4 Select the entire <object> element and press Ctrl + C (PC) or Command + C (Mac

OS). Be sure to copy the entire 11 lines of code.

5 In your original HTML document, make sure your cursor is inside the

Sl_content div and then press Ctrl + V (PC) or Command + V (Mac OS) to paste

the <object> element. You now need to update the link to the XAP fi le to refl ect your

folder. Locate the following code:

<param name="source" value="ClientBin/test.xap"/>

Update the value to refl ect the path to your Silverlight fi le:

<param name="source" value="SilverlightAssets/smoothiefooter.xap"/>