Adding a coloured border one the outside of a one row-two column t

G

Guest

Help!! I am creating a one row-two column table with a coloured border. I
only want the coloured border on the outside of the table but I keep getting
a coloured line inbetween the two columns - whereas I want the internal line
to be the dotted line that doesn't show up when published. I have tried
selecting the table and adding a solid box border but it still colours the
internal line. I have tried collapsing the borders but this doesn't work. I
would really appreciate it if somebody could help.
 
M

Murray

Try this -

<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td style="border:solid teal; border-width:1px 0 1px 1px;">whatever</td>
<td style="border:solid teal; border-width:1px 1px 1px; 0;">whatever</td>
</tr>
</table>
 
G

Guest

Thanks Murray - if poss could you also tell me how to select the table from
Design view - just the outer side of table to add the border and leave the
middle of table with dotted line. The code is great but also I want to know
how to do from Design view.
 
M

Murray

There are many things that cannot be done well if you confine your
operations to Design view. This means that the more comfortable you become
with HTML markup, the better you will become at using FP.

In FP (I am using 2003), create some new styles by using FORMAT | Style....,
select User-defined styles from the Styles List: dropdown, and enter
"td.left" in the Name (selector): field. Then click on the FORMAT button at
the bottom, select Border, and in the Style: list, click on "solid". Now
set the color value as you want, the Width to 1, and click to remove the
right border. Click OK, OK, OK to exit the dialog. Do the same process to
define a second style called td.right, only this time make it have top,
right, and bottom borders only.

This process should leave you with the following code in the head of the
page -

<style>
<!--
td.left { border-left: 1px solid #FF0000; border-top: 1px solid
#FF0000;
border-bottom: 1px solid #FF0000 }
td.right { border-right: 1px solid #FF0000; border-top: 1px solid
#FF0000;
border-bottom: 1px solid #FF0000 }
-->
</style>
</head>

You have created the CSS styles, and now you must make them work on your
page. So, click in the left cell, and bring up its properties
 
M

Murray

Oops - hit send by mistake! Here's the whole enchilada again.

There are many things that cannot be done well if you confine your
operations to Design view. This means that the more comfortable you become
with HTML markup, the better you will become at using FP.

In FP (I am using 2003), create some new styles by using FORMAT | Style....,
select User-defined styles from the Styles List: dropdown, and enter
"td.left" in the Name (selector): field. Then click on the FORMAT button at
the bottom, select Border, and in the Style: list, click on "solid". Now
set the color value as you want, the Width to 1, and click to remove the
right border. Click OK, OK, OK to exit the dialog. Do the same process to
define a second style called td.right, only this time make it have top,
right, and bottom borders only.

This process should leave you with the following code in the head of the
page -

<style>
<!--
td.left { border-left: 1px solid #FF0000; border-top: 1px solid
#FF0000;
border-bottom: 1px solid #FF0000 }
td.right { border-right: 1px solid #FF0000; border-top: 1px solid
#FF0000;
border-bottom: 1px solid #FF0000 }
-->
</style>
</head>

You have created the CSS styles, and now you must make them work on your
page. So, click in the left cell, format it using FORMAT | Style...., and
selecting td.left from the list of styles. Do the same with the right cell
and td.right. This should now give you code like the following -

<tr>
<td class="left">&nbsp;</td>
<td class="right">&nbsp;</td>
</tr>

Does that do what you wanted?
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top