asked on

padding-left in <td>

to which elements should i put padding-left ? tbody, table, tr, td ?
currently i use this ugly code in each cell
------------------
<td>  "&rs("FieldName")&"</td>

jonnyfb

Use This:

<td style="padding-left:VALUE">

Replace value with the required amount of pixels.
Its so simple I tested is just now!

ill

ASKER

i do not want to place into each cell until i really have to

RozanaZ

jonnyfb

Or if you only want it in certain cells (not every table on your whole page) Put this:

<style>
#padding
{
padding-left: 15px;
}

<td id="padding">

Nothing is wrong with RozanaZ 's way but if you have other tables, your page will be distorted!

jonnyfb

Although you dont want to put code in every cell, Its the only way, man!

mreuring

Jonny please don't suggest using id's for formatting several elements on the same page. Id's should be unique on a single page, classes were invented for these cases.

jonnyfb

Fine, We'll do it your way!

<style>
.padding
{
padding-left: 15px;
}

<td class="padding">

It still works!

mreuring

What I would like to know is, what are you trying to achieve with this code-snippet:
<td>  "&rs("FieldName")&"</td>

Is it only the first table-colum that's being indented, or are do trying to do this to every cell in the table. If the latter, RozanaZ's solution is the obvious.

ill

ASKER

this one work. is it correct way ?
table#tab_detail td {
padding-left: 3em;
border: solid #ffffff 0px;
}

RozanaZ

Depands how do you use it...

jonnyfb

Yes it will still work!

ill

ASKER

@mreuring
it works for whole table now, but i would like to have it different for each column

jonnyfb

Can someone tell me what is wrong with this???

<style>
.padding
{
padding-left: 15px;
}

<td class="padding">

RozanaZ

<HTML>
<HEAD>
<TITLE></TITLE>

<style>
.type1
{
      padding-left: 15px;
}
.type2
{
      padding-left: 5px;
}
</style>

</HEAD>

<BODY>
<table border="1">
      <tr>
            <td class="type1">s dfs fsdf </td>
            <td class="type2">sdf sdf sdf</td>
      </tr>
      <tr>
            <td class="type1">s dfs fsdf </td>
            <td class="type2">sdf sdf sdf</td>
      </tr>
      <tr>
            <td class="type1">s dfs fsdf </td>
            <td class="type2">sdf sdf sdf</td>
      </tr>
      <tr>
            <td class="type1">s dfs fsdf </td>
            <td class="type2">sdf sdf sdf</td>
      </tr>

</table>
</BODY>
</HTML>

Brandwood

just so your clear

if you put a style on an element, say a td, as RozanaZ suggested, then it will aply to all the td's where the style is included.

the other ways are pretty much the same.

in-line style as jonnyfb suggested, an a style by calling the style class defined in a similar way to RozanaZ. (Notice the dot before class name.)

jonnyfb was wrong to suggest that "its the only way" cause RozanaZ's answer will do exactly what your asking.

jonnyfb

Why dont you just add a different class to each different cell in a different colum?

It is the only way!!!

jonnyfb

Fine... You obviously have no need for me here...

Brandwood

while i was typin that a million different answers came in an you changed you mind as to what you wanted.

jonnyfb

So you mean my answer is correct?

Brandwood

tis now, he's changed his mind, yeah

jonnyfb

Great! I finally can get some points!

ill

ASKER

<!--
sorry for my disabbility to ask question.:/
i just wanted to know, where padding-left should be placed, if i want last column to be padded more than others .
also, i'm increasing points for this debate;)
<html>
<head>
<style>
th{
      background-color: navy;
      color:white;
      border:0;
      }
td{
      text-align:right;
}
table#tab_detail td {
padding-left: 3em;
border: solid #ffffff 0px;
}
</style>
</head>
<body>
<table id='tab_detail' style='spacing:20px;'>
<thead style='font-size:smaller;border:0px none;'>
      <tr><th>Time</th><th>1.¼h</th><th>2.¼h</th><th>3.¼h</th><th>4.¼h</th><th>Sum</th></tr>
</thead>
<tbody>
      <tr style='background-color:#ddf0f9'>
            <td>06:00 </td>
            <td>800.00</td>
            <td>10280.00</td>
            <td>1032360.00</td>
            <td>10323160.00</td>
            <td>  9743250.00</td>
      </tr>
</tbody>
</table>
</body>
</html>

SOLUTION

mreuring

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

jonnyfb

<html>
<head>
<style>
colum1{padding-left:10}
colum2{padding-left:10}
colum3{padding-left:10}
colum4{padding-left:10}
colum5{padding-left:10}
colum6{padding-left:50}
th{
background-color: navy;
color:white;
border:0;
}
td{
text-align:right;
}
table#tab_detail td {
padding-left: 3em;
border: solid #ffffff 0px;
}
</style>
</head>
<body>
<table id='tab_detail' style='spacing:20px;'>
<thead style='font-size:smaller;border:0px none;'>
<tr><th>Time</th><th>1.¼h</th><th>2.¼h</th><th>3.¼h</th><th>4.¼h</th><th>Sum</th></tr>
</thead>
<tbody>
<tr style='background-color:#ddf0f9'>
<td class="colum1">&>06:00 </td>
<td class="colum2">&>800.00</td>
<td class="colum3">&>10280.00</td>
<td class="colum4">&>1032360.00</td>
<td class="colum5">&>10323160.00</td>
<td class="colum6">  9743250.00</td>
</tr>
</tbody>
</table>
</body>
</html>

ASKER CERTIFIED SOLUTION

RozanaZ

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

seanpowell

ill,

A few comments:

1. RozanaZ has adequately answered your question with that last post.
2. This has no meaning: style='spacing:20px;'
3. jonnyfb - I'm afraid that http:#11713553 is completely invalid CSS :-)

jonnyfb

.colum1{padding-left:10}
.colum2{padding-left:10}
.colum3{padding-left:10}
.colum4{padding-left:10}
.colum5{padding-left:10}
.colum6{padding-left:50}

seanpowell

jonnyfb,
With all due repsect, what you posted is still invalid :-)
The question has already been adequately answered...

jonnyfb

Why dont we let the AUTHOR OF THE QUESTION DECIDE!

seanpowell

I'm sure they will - but a relative simple question has become a very long thread.
I am merely trying to moderate the thread to make sure that it doesn't get too confusing - it can be very difficult for someone who's new to CSS to make heads or tails of things when the comments come in at the rate that they did here.

ill

ASKER

agree, it's a solution, but one more question.
can ".type1" be changed to add to td padding, not to override ?
2em(td) +3em ( .type1)

---------------
.type1
{
padding-left: 3em;
}
this one should be 5 em
<td class="type1">9743250.00</td>

seanpowell

Please don't accept this comment...
No - the class will override what's in the cell. You can't accumulate padding in that way...

ill

ASKER

thanx all.
i'm not css expert, so sorry for my unclear question/comments.
there is a problem to choose points for solution in new area, when one don't know how difficult it is.

seanpowell

Not to worry ill - you only need to ask if you're unsure. The experts here will always help you through.
mreuring, I'm sorry, I missed your post too - fortunately ill did not.
(...adjascent sibling selectors - I just love that term...)

padding-left in &lt;td&gt;

padding-left in <td>