×
INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Contact US

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Students Click Here

Can I select all child TD's using Parent TR's id?

Can I select all child TD's using Parent TR's id?

Can I select all child TD's using Parent TR's id?

(OP)

CODE

tr[id^="W9Data"] {
 border-bottom: 1px solid black;
}
I can select the tr's but I need to select it's child TD's. 
The Parent TR's have an id beginning with string "W9Data". I'm trying to select the child TD's to apply a bottom border to them.

Any help much appreciated.

Lyndon

Lyndon

RE: Can I select all child TD's using Parent TR's id?

Try:

CODE

tr[id^="W9Data"] td {
 border-bottom: 1px solid black;
} 

----------------------------------
Phil AKA Vacunita
----------------------------------
OS-ception: Running Linux on a Virtual Machine in Windows which itself is running in a Virtual Machine on Mac OSx.

Web & Tech

RE: Can I select all child TD's using Parent TR's id?

(OP)
No luck, that doesn't do it.

Lyndon

RE: Can I select all child TD's using Parent TR's id?

(OP)
So I wonder if I'm misunderstanding the ^? These TR's are dynamically named W9Data1, W9Data2, W9Data3... My understanding is that the caret would select ID's that contain "W9Data".

Lyndon

RE: Can I select all child TD's using Parent TR's id?

This tr[id^="W9Data"] selects all TRs that have an ID that starts with "W9Data". If there's anything before that, it will not work.
In other words: <tr id="W9Data1"> would be selected, <tr id="something W9Data1"> would not.

Adding the TD after that, should select all TDs that are children of all TR's that have an ID that starts with "W9Data"

Just like doing tr#theID td{} would select all td that are children of Tr's that have an id of "theID".

The code works with this example HTML:

CODE

<!DOCTYPE HTML>
<html>
<style type="text/css">
td
{
	border: 1px solid blue;
}
tr[id^="W9Data"] td
{
	border: 1px solid red;
}
</style>
	<body>
		<table>
		<tr id="W9Data1"><td>cell1</td><td>cell2</td><td>cell3</td></tr>
		<tr id="W9Data1"><td>cell1</td><td>cell2</td><td>cell3</td></tr>
		<tr id="else_W9Data1"><td>cell1</td><td>cell2</td><td>cell3</td></tr>
		<tr id="W9Data1"><td>cell1</td><td>cell2</td><td>cell3</td></tr>
		</table>
	</body>
</html> 

Note that the 3rd row, would not have a border as it would match the CSS selector.






----------------------------------
Phil AKA Vacunita
----------------------------------
OS-ception: Running Linux on a Virtual Machine in Windows which itself is running in a Virtual Machine on Mac OSx.

Web & Tech

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members! Already a Member? Login


Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close