Free Trial

Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.

  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

CHAPTER 20: Working with the Box Model > Setting an Element Box Type

Setting an Element Box Type

The display property provides a way for you to change the type of box for an element, which changes the way that an element is laid out on the page. In Part II of this book, you will have noticed that some of the elements have a style convention that includes a value for the display property. Many elements use the default value, inline, but some specify other values. The set of allowed values for the display property are described in Table 20-9.

Image

Image

These values cause a lot of confusion, and they have a profound effect on the layout of your documents. I explain each kind of box type in the sections that follow.

Understanding Block-Level Elements

When you use the block value, you create a block-level element. This is an element that is vertically distinct from those that surround it. You would usually achieve this effect by placing a line break before and after the element, creating a sense of separation between the element and its surroundings, much like a paragraph appears in a book. The p element, which denotes a paragraph, includes the block value for the display property in its default style convention, but you may apply this value to any element, as shown in Listing 20-9.


  

You are currently reading a PREVIEW of this book.

                                                                                                                    

Get instant access to over $1 million worth of books and videos.

  

Start a Free Trial


  
  • Safari Books Online
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint