I am trying select specific div located in <td></td> tags mark based on text located in another <td></td> tag. Probably html code will describe it easier:
<tr>
<td>
<div class="name">test1</div>
</td>
<td>
<div class="created">Tom</div>
</td>
<td>
<div class="custom">Disabled</div>
</td>
<td>
<div class="custom">Failed</div>
</td>
</tr>
<tr>
<td>
<div class="name">test2</div>
</td>
<td>
<div class="created">Tom</div>
</td>
<td>
<div class="custom">Disabled</div>
</td>
<td>
<div class="custom">Failed</div>
</td>
</tr>
<tr>
<td>
<div class="name">test3</div>
</td>
<td>
<div class="created">Kate</div>
</td>
<td>
<div class="custom">Disabled</div>
</td>
<td>
<div class="custom">Failed</div>
</td>
</tr>
So on this example what I would like to select by Xpath is the second row and div with Failed text. But I can not use indexing because size and placement is not constant always and can change in time. So only unique field is div with class of name in my case test2.
I was thinking of using maybe following-sibling. Maybe something like this:
\\tr\div[#class='name' and text()='test1'] but what next? div is not sibling but td is.
Any ideas?
I was able to solve it by using:
//td/div[text()='test1']/ancestor::tr/td/div[#class='custom' and text()='Failed']
If you are trying to get the status of the test based on Test Name then use the below xpath.
(//div[normalize-space(.)='test2' and #class='name']/ancestor::tr//div)[last()]
Related
I have been working a lot on 2 columns inside of a table with the foundation framework. I cannot understand why column 2 is going down under column 1, when I resize my window to under 600px? I would like that the columns are staying beside each other, when the window is resized. I have set the column to fill 6 each, so the second column should not jump down?
Does anybody knows how I can solve this? The code is for email newsletter, that is why I am using tables.
I have a JSfiddle with the CSS code aswell: jsfiddle
<body>
<table class="body">
<tr>
<td class="center" align="center" valign="top">
<center>
<table class="row footer">
<tr>
<td class="wrapper">
<table class="six columns">
<tr>
<td class="left-text-pad">
<h5>Column 1</h5>
<table>
<tr>
<td>
A content text 1
</td>
</tr>
</table>
<h5>A Headline</h5>
<table>
<tr>
<td>
A content text 2
</td>
</tr>
</table>
<h5>A Headline</h5>
<table>
<tr>
<td>
A content text 3
</td>
</tr>
</table>
</td>
<td class="expander"></td>
</tr>
</table>
</td>
<td class="wrapper">
<table class="six columns">
<tr>
<td class="left-text-pad">
<h5>Column 2</h5>
<table>
<tr>
<td>
A content text 1
</td>
</tr>
</table>
<h5>A Headline</h5>
<table>
<tr>
<td>
A content text 2
</td>
</tr>
</table>
<h5>A Headline</h5>
<table>
<tr>
<td>
A big text to test if the text is responsive.
</td>
</tr>
</table>
</td>
<td class="expander"></td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
</body>
Above first wrapper class there is a tag.So write style inside tr tag like
As of this writing, there is still use of the nested table layout for most email clients. The answer for this is simple: Not all clients are up to speed, not all computers are up to speed.
Using tables in html emails is the most practiced and best method for overall deployment regardless of your email client. Foundation is nice, yes - but it is not the email industry standard as of yet.
Take a look at this handy tutorial from Mailchimp. I just wanted to clarify that you are not wrong for doing it this way, and you will be better off learning responsive email coding from the aforementioned tutorials first.
All that being said - what you've done in your jsfiddle is actually correct. But if you do NOT want them to collapse, simply remove the #media query strings.
Add "float: left" to the second wrapper of column2
<table width="200pxpx" bgcolor="#00FF00">
<tr>
<td>
<span align="left">1</span>
<span align="right">2</span>
</td>
</tr>
</table>
What I would like to achieve is that 1 appears at the left end and 2 appears at the other end.
So in the script, 1 and 2 both show up at the left end of the TD.
I've also tried to add "align" attribute to make it happen but it didn't work either.
What you're looking for is the css-style float:right.
<table style="width:200px; background-color:#00FF00;">
<tr>
<td>
<span style="float:left;">1</span>
<span style="float:right;">2</span>
</td>
</tr>
</table>
Edit: It's also better to use style for the other styling of your table (this is HTML5 standard I believe)
You can use float.
<table width="200pxpx" bgcolor="#00FF00">
<tr>
<td>
<span style="float:left;">1</span>
<span style="float:right;">2</span>
</td>
</tr>
</table>
I want to left-justify one item, and right-justify the other item inside a single td. Is that doable? Thanks.
test.php
<table border = '1'>
<tr><td>Left-justified Right-justified</td></tr>
<tr><td>TEXTTEXTTEXTTEXTTEXTTEXTTEXT</td></tr>
</table>
Try this...
<table border = '1'>
<tr>
<td>
<span >Left-justified</span>
<span style="float:right;"> Right-justified</span>
</td>
</tr>
<tr>
<td>
TEXTTEXTTEXTTEXTTEXTTEXTTEXT
</td>
</tr>
</table>
I want to know how do you skip a tag in HTML5.0. I mean literally, without CSS. Instead of an empty box, I want it to be filled in, not just blank. Any help would be appreciated
You can use colspan or rowspan.
<table>
<tr>
<td colspan="2">
Header
</td>
</tr>
<tr>
<td>
Text
</td>
<td>
Text
</td>
</tr>
<tr>
<td>
Text
</td>
<td>
Text
</td>
</tr>
</table>
Every time I render the HTML the divs are pushed out of the table.
What is the proper way to get the same behavior as divs? I am trying to hide chunks of a table using jQuery.
Follow This Format:
<table width="200" border="1">
<tr id="1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr id="2">
<td> </td>
<td> </td>
<td> </td>
</tr>
<DIV>EXPANDING UPON ROW 2 AT BLOCK LEVEL But UN-effecting ROW 1 AND 3</DIV>
<tr id="3">
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>