Tutorial search

Coding a content box in Dreamweaver - Dreamweaver tutorial

Learn how to create a nice content box around your text in Dreamweaver
Category: Dreamweaver tutorials - Difficulty:

Open up Adobe Photoshop with your content box.

Flatten your content box layers by going, layers > flatten images.

Take the Rectangular Marquee Tool (M).

Take the tool and make a rectangle around the top part of your box like so, copy it ( controle C) and open a new document in Adobe Photoshop and paste it in it. Save it.

Do this two more times so you have 3 images like the bellow:

Open up Dreamweaver, Insert > Table and make a new table.

Rows: 3
Columns: 1
Table width: 188 (the width of my content box)
Border thickeness: 0
Cell padding: 0
Cell spacing: 0

Now Click OK.

In the first table put your first image, in your second table your have to make your second image your background, you do this by going to the bottom properties and next to Bg search for your second image. In your third box you can put your third image in.

You should now have this:

In the middle table you can put your content in, it will expand as you put more content in as so.

You now know how to code a content box!