legend internet ltd
solutions  support   online tools   resources   news    webmail               join legend
6th January 2009
  about careers contact home

Borders in Dreamweaver

This is posibly one of the best little tips i would give anyone wanting too make the website look smart and clean. By just placeing your content within on of these fancy Borders can really finish off the look and feel of your site.

1. Insert a table

go to INSERT>Table in dreamweaver and insert a table


2. Table Properties

A dialogue box should pop up like the one on the left. Enter the values that I used and make sure that your width is set in PIXELS. For my cell padding I used 1, but depending on how big you want the border to be you may want to use a large number.

Your table should have been inserted and it should look like it has dotted lines around it, this is good!


3. Table Background Color

We are now going to have to set our table background color to a color that we would set a border at. Usually this would be a light color such as white, or a light grey. I am going to use white for my border.

Click on the top left of your table, when you are clicking on it you should see a little 4 arrowed cursor, like the picture on the left!

Click on it and then continue on to the next step.



4. Properties Dialog Box


Lets make sure that you are seeing what I am seeing. Go to Window>Properties and make sure that you have the properties dialogue box up. If you recently installed dreamweaver you may need to know that you have to click on the little down arrow on the bottom right of the properties dialogue box. Don't worry, if you dont understand take a look at the picture provided. Make sure you click on that little downarrow, this will get you the extra options for almost everything.

Once you have clicked it your properties box should get taller, about the same size as mine, picture provided.


5. Lets Continue

Make sure you click on the top left of the table again to get our properties up. If you dont know what I mean go back to step 4.

After you have clicked on the top left of the table go to your properties dialogue box and you should see BG with a box to the right of it.

Make sure that you click on the empty box to the right of it and click on it. Another box should come up with a bunch of colors, select white. If you are smart with HEX code you could just type in #FFFFFF which is white.

Your table should now be filled with white.


6. Table # 2

Click your mouse inside of your first table.Now go to Insert>Table and fill in the properties like the picture to the left.

Make sure that your width is set to PERCENT.


Now go to your BG again on the properties dialogue box and fill the BG with the color of your choice. I used #003366 as my HEX. Take a look to the left.





5. Done


After you have completed all of the steps your table should look like the one on the left. If not follow the tutorial again very very carefully as it is pretty tricky.


 

and that it its that simple!

 

tutorial from http://www.pixeljunction.com/

Acceptable Use Policy   |   Terms and Conditions   |   Privacy Policy   |   Site Map   |   Jargon Buster