How do I increase the column width?

I would like to extend the width of the columns.  How do I do that?

newbieweb

<table>
<tr>
<td>Phone</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$29.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
<tr>
<td>Monthly Fee</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$35.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
</table>
newbiewebSr. Software EngineerAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

newbiewebSr. Software EngineerAuthor Commented:
And how do I insert a blank line in the table?

<table>
<tr>
<td>Phone</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$29.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
// insert blank line here, betweenthe rows
<tr>
<td>Monthly Fee</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$35.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
</table>
0
samg3Commented:
Here is one way of adjusting the width and inserting a blank row. The parameters and code for the extra table row are in bold. Let me know if this helps you out.

<table width="300">
<tr>
<td width="100">Phone</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$29.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
<tr>
<td width="100">&nbsp;</td><td></td><td></td></tr>
<tr>
<td width="100">Monthly Fee</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$35.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
</table>
0
newbiewebSr. Software EngineerAuthor Commented:
Cool!

How do I pad the whole thing with spaces on the left?  Or shift the whole table towards the center?

And how do I insert a blank line?

0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

fcardinauxCommented:
Here is how to center your table horizontally and insert a blank line
<table style="position: absolute; left: 50%; margin-left: -150px; width: 300px; text-align: left">
<tr>
<td width="100">Phone</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$29.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
<tr>
<td colspan="3">&nbsp;</td><!-- This is the blank line, and 3 is the number of columns of your table -->
</tr>
<tr>
<td width="100">Monthly Fee</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$35.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
</table>

Open in new window

0
fcardinauxCommented:
And this is the same table shifted 100px downwards.

Note also that I've replaced "position: absolute" by "position: relative". Depending on your situation, you should do the same (http://webdesign.about.com/od/advancedcss/a/aa061307.htm).
<table style="position: relative; left: 50%; top: 100px; margin-left: -150px; width: 300px; text-align: left">
<tr>
<td width="100">Phone</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$29.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
<tr>
<td colspan="3">&nbsp;</td><!-- This is the blank line, and 3 is the number of columns of your table -->
</tr>
<tr>
<td width="100">Monthly Fee</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$35.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
</table>

Open in new window

0
newbiewebSr. Software EngineerAuthor Commented:
I do not have your code working yet.  Here's the way it loked with this kind of definition:

<table width="600">


Then second picture uses this kind of definition:

<table style="position: relative; left: 50%; top: 100px; margin-left: -150px; width: 600px; text-align: left">

and looks like in the second picture:

Can you suggest what I am doing wrong?  I just want the table, which looks good, to shift the right a bit.

UnShiftedTable.JPG
ShiftedTable.JPG
0
fcardinauxCommented:
This code should do what you want:

Note that in my previous code, the table is centered if the margin-left value is half the table width. So if you want a 600px wide table, you must change the margin-left value to 300px.
<table style="left: 100px; width: 600px; text-align: left">
<tr>
<td width="100">Phone</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$29.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
<tr>
<td colspan="3">&nbsp;</td><!-- This is the blank line, and 3 is the number of columns of your table -->
</tr>
<tr>
<td width="100">Monthly Fee</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$35.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
</table>

Open in new window

0
fcardinauxCommented:
Sorry, I forgot the "position: relative" style value
<table style="position: relative; left: 100px; width: 600px; text-align: left">
<tr>
<td width="100">Phone</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$29.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
<tr>
<td colspan="3">&nbsp;</td><!-- This is the blank line, and 3 is the number of columns of your table -->
</tr>
<tr>
<td width="100">Monthly Fee</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$35.95</td>
<td style="text-align: right; font-family: Courier New,Courier,mono;">$99.95</td>
</tr>
</table>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.