I have table with one one row and one cell.With in that cell some text and another table is there.What I am expecting is that the inner table should come at right to text,but its going to next line.How to achieve that?
Here is my code...
<!DOCTYPE HTML>
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
<table border="1">
<tr>
<td>
Here is some text
<!-- Inner Table. This table should come at right to the above text-->
<table style="border:1px solid blue;">
<tr>
<td>1</td>
<td>Krish</td>
</tr>
<tr>
<td>2</td>
<td>Alex</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
you should specify float:right or float:left
As per your html, specify table with float:right as
<table style="border:1px solid blue;float:right;">
Related
The minimal code is given below. Note that -
I need 1px border(I think that means need border-collapse).
Also transition and background-color change cannot be compromised.
CSS only solution.
Am doing wrong or would you have a fix/alternate, or its a bug. Please help me out. Thank you.
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
#wrap-div{display:flex;}
#com_table{width:800px; border-collapse:collapse; border-spacing:0px; margin:50px auto;text-align:center}
th, td{border:1px solid #3AC;}
#com_table > tbody > tr:hover{color:#fff; background-color:#aaa; transition:all .25s linear;}
</style>
</head>
<body>
<div id="wrap-div">
<table id="com_table">
<thead>
<tr>
<th>Order Date</th>
<th>Status</th>
<th>Total Amt</th>
</tr>
</thead>
<tbody>
<tr>
<td>24/05/2021</td>
<td>NEW</td>
<td>900.00</td>
</tr>
<tr>
<td>24/05/2021</td>
<td>CONFIRMED</td>
<td>900.00</td>
</tr>
<tr>
<td>28/05/2021</td>
<td>CONFIRMED</td>
<td>850.00</td>
</tr>
<tr>
<td>28/05/2021</td>
<td>CONFIRMED</td>
<td>1845.00</td>
</tr>
<tr>
<td>15/05/2021</td>
<td>SETTLED</td>
<td>4221.00</td>
</tr>
<tr>
<td>17/05/2021</td>
<td>SETTLED</td>
<td>1549.00</td>
</tr>
<tr>
<td>17/05/2021</td>
<td>SETTLED</td>
<td>250.00</td>
</tr>
<tr>
<td>18/05/2021</td>
<td>SETTLED</td>
<td>1249.00</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
We have w2ui dropdown element on our web site, and I want to run script using selenium IDE for testing, I have recorded steps but getting error when I run that script(element not found). Is there any way to handle w2ui element in Selenium IDE (specially dropdown list). I have tried xpath, still doesn't select value in the drop-down list.
There can be cases where Selenium IDE recorded may not able to correctly identify the element. In these cases, user need to modify the script to ensure that elements are correct identified and entered.
Please refer below example. Recorded script did not work to select the w2ui drop list. I updated the script such that it correctly identifies the element and select it.
Can you please also update your script such that when execute IDE works on correct element?
Record script in Selenium IDE
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://selenium-ide.openqa.org/profiles/test-case">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="selenium.base" href="http://w2ui.com/" />
<title>Recorded Script</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">Recorded Script</td></tr>
</thead><tbody>
<tr>
<td>open</td>
<td>/web/docs/form/fields-list</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>css=input[type="text"]</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>css=tr.w2ui-item-odd.w2ui-selected > td.menu-text</td>
<td></td>
</tr>
<tr>
<td>type</td>
<td>//input[#type='combo']</td>
<td>Testing</td>
</tr>
</tbody></table>
</body>
</html>
Updated Script
I modified the script to correctly identify the w2ui drop list by class name and correct input field the drop list. This script is working fine when I run in Selenium IDE.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://selenium-ide.openqa.org/profiles/test-case">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="selenium.base" href="http://w2ui.com/" />
<title>Updated script</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">Updated script</td></tr>
</thead><tbody>
<tr>
<td>open</td>
<td>/web/docs/form/fields-list</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>class=w2ui-icon icon-search</td>
<td></td>
</tr>
<tr>
<td>type</td>
<td>class=w2ui-select w2field</td>
<td>Andrew Johnson</td>
</tr>
<tr>
<td>storeValue</td>
<td>class=w2ui-select w2field</td>
<td>x</td>
</tr>
<tr>
<td>echo</td>
<td>${x}</td>
<td></td>
</tr>
<tr>
<td>type</td>
<td>//input[#type='combo']</td>
<td>Testing</td>
</tr>
<tr>
<td>storeValue</td>
<td>//input[#type='combo']</td>
<td>y</td>
</tr>
<tr>
<td>echo</td>
<td>${y}</td>
<td></td>
</tr>
</tbody></table>
</body>
</html>
I got the solution using JavaScript. Command- runScript and Target- document.getElementById('DropdownId').value='Dropdown item value' by using this its getting selected.
I have come across a scenario where we have to enter the any text in the search textbox say for example ww enter "Context" in the search text box and then we have to verify the first link in the search page to be "ConTEXT". I am using various verify commands like verifyText, verifyTextPresent, verifyElementPresent. But its showing false when i am runnig using selenium IDE.How could I verify the first link is "ConTEXT"?
Thanks in advance
You need to wait the result element with the waitForElementPresent. You can see the full test code at the following.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://selenium-ide.openqa.org/profiles/test-case">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="selenium.base" href="https://www.google.com/" />
<title>New Test</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">New Test</td></tr>
</thead><tbody>
<tr>
<td>open</td>
<td>/?gws_rd=ssl</td>
<td></td>
</tr>
<tr>
<td>type</td>
<td>id=gbqfq</td>
<td>ConTEXT</td>
</tr>
<tr>
<td>click</td>
<td>id=gbqfb</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>css=div.vk_ans > span</td>
<td></td>
</tr>
<tr>
<td>assertText</td>
<td>css=div.vk_ans > span</td>
<td>con·text</td>
</tr>
</tbody></table>
</body>
</html>
I've the below html.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<form name="new" method="post" action="GetR.jsp">
<div class="Main">
<table width="200" border="1">
<tr>
<td>Units</td>
<td><input type="text" name="Units" id="Units"></td>
</tr>
<tr>
<td>Product Type</td>
<td><input type="text" name="ProdT" id="ProdT"></td>
</tr>
<tr>
<td>Hours</td>
<td><input type="text" name="hours" id="hours"></td>
</tr>
<tr>
<td colspan="2"><input name="submit" type="submit" id="submit" value="Submit"></td>
</tr>
</table>
</div>
</form>
</body>
</html>
and the below data base table
here actually when the user enters the number of units and hours and product type(product type is same as database table name) based on the input, the output should be the column names(whether it is achieved, exceeded or far exceeded) . please let me know how can i write a query for it.
for example the given row.
we entered the units as 1, and if the hours is 8(4.1hrs-8hrs), it should show No.of.Hours for Achieved, if hours is 4(2.1hrs-4hrs) it should show Exceeded and if 2(below 2 hrs) it should show Far-Exceeded.
Thanks
I'm fighting with bad support of html clients for CSS and I need to do a email template with table layout.
I just can't place and align tables within tables correctly. I tried it with valign etc. but this doesn't work...
How can I place one table within another table on top and in the center?
To illustrate I've posted this fiddle:
http://jsfiddle.net/eabJh/1/
The <td >Another nested table</td> is in center position but not on top but in the middle.
Here is my html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<body style="background-color: black">
<table background="http://i3.mirror.co.uk/incoming/article276604.ece/ALTERNATES/s615/tweet-that-ricky-gervais-jibe-at-mongs-pic-twitter-com-rickygervais-132840776.jpg" width="810" border="20" bordercolor="white" style="border-style:solid; border-spacing:0px; border-collapse:collapse">
<tr style="height:400px">
<td>test
<table width="380" cellspacing="0" cellpadding="2" align="center" border="0">
<tr>
<td >Another nested table</td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
</html>
Updated Fiddle
Use valign = "top":
<td valign = "top">test
<table width="380" cellspacing="0" cellpadding="2" align="center" border="0">
<tr>
<td>Another nested table</td>
</tr>
</table>
</td>