Exercise 6.1

 

<!doctype html>

<html>

<head><title>Chapter 6 - Display and Visibility</title>  

<style type="text/css">

 

#displaydemo {

border: 1px dashed black;

                background-color: yellow;

                display: inline;

                width: 100px;

                height: 100px;

}

 

#magic {

display: inline;

}

 

#magicsentence {

                color: blue;

                font-size: 2em;

}

</style></head>

 

<body>

<p>This <span id="displaydemo">yellow box</span> is used to demonstrate the difference between an inline and a block element.</p>

<p id="magicsentence">"This is just like <span id="magic">magic</span>. You can make words disappear."</p>

</body></html>