<tr>
<th>Photo</th>
<th>Description</th>
<th>Price</th>
</tr>
<tr>
<td>
<img src="images/square.png" alt="box" width="70px" />
</td>
<td class="description">The Rhodes piano is an electro-mechanical piano,
invented by Harold Rhodes during the fifties and later manufactured in a number
of models, first in collaboration with Fender and after 1965 by CBS. It employs
a piano-like keyboard with hammers that hit small metal tines, amplified by
electromagnetic pickups.
</td>
<td id="price">$1400</td>
</tr>
</table>
What I am trying to achieve here is for the $1400 price range to line up with the first line of text in the paragraph. I will have two more of these tables that look exactly the same. I have learned that when entering table data; the data will be in the center of the box. What I think works is giving the price range a class and moving them up using padding-bottom by 55px. I was jsut wondering if there was a better way to move up the price range?
Related
I am working for a project where I need to convert the html that photoshop generates to email client compatible.
Once I receive a psd file, I need to create slices and then generate the html. The problem is that the generated html has tables with rowspan and colspan. I then manually remove these colspans and rowspans and nest tables to achieve the same layout.
My question is, is there a library or something that I can use to automate this task?
Below is just an example, the real problem can include various colspans and rowspans in any specific order.
Example -
PS code ->
<tr>
<td colspan="3">First row 3 columns</td>
</tr>
<tr>
<td>Second row first column</td>
<td>Second row second column</td>
<td>Second row column column</td>
</tr>
I will then have to code this as -
<tr>
<td>First row 3 columns</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>Second row first column</td>
<td>Second row second column</td>
<td>Second row column column</td>
</tr>
</table>
</td>
</tr>
I work for a company who deliver many HTML emails everyday, i'm email HTML developer, and we use Fireworks (CS6, he's not in the CC..) to generate nested tables (some options are to define).
G.
HTML tables with system commands run long, as seen here:
https://help.ubuntu.com/community/SwitchingToUbuntu/FromLinux/RedHatEnterpriseLinuxAndFedora
Is there a Bootstrap3 way to make tables like these responsive, keeping the wide appearance for desktop and creating a mobile appearance that carries the context of the action and the OS vendor for each command without requiring scrolling?
you can use Contextual classes for styling bootstrap table row:
<tr class="active">...</tr>
<tr class="success">...</tr>
<tr class="warning">...</tr>
<tr class="danger">...</tr>
<tr class="info">...</tr>
also, you can use non-standart thead repeating, not highly recommended but workes:
<table>
<thead> ... </thead>
<tbody> ... </tbody>
<thead> ... </thead>
<tbody> ... </tbody>
</table>
Inside a parent table, I have table1(with 3 rows) and table2(with 2 rows). I need table2 to align at the top with table1 and right now its centering table2. I know about divs and float but this page is getting sent through a mail server and it renders the page all weird and I have to use tables.
I tried to post some images of my code but its saying I need at least 10 reputations to post images?
try adding valign="top" on your parent table td elements as the default vertical alignment is center or middle for td elements
<table id="parent">
<tr>
<td valign="top">
<table id="table1"></table>
</td>
<td valign="top">
<table id="table2"></table>
</td>
</tr>
</table>
is there a way to add cells in a row column in html table without adding another table inside the row column
I have attached the image. and here is my code
<tr>
<tbody>
<td>Name</td>
<td><div id="span1">Units</div>
<div id="span2" class="side-border">price</div>
<div id="span2" class="r">value</div>
</td>
</tbody>
</tr>
If you want to have some different structure of your rows, you should check colspan and rowspan. The numbers should add up.
Example
<table border="1px">
<tr>
<td colspan="5">Hello</td>
<td>World</td>
</tr>
<tr>
<td rowspan="2">col 1</td>
<td colspan="4">CENTER</td>
<td>right</td>
</tr>
<tr>
<td colspan="3">Text</td>
<td colspan="3">bottom right</td>
</tr>
</table>
If you were to add the numbers from colspan they add to 6 and rowspan goes to 3. There are some things you have to take care of though. It's a little hard for me to explain now what those are, just try to visualise how you want your table to look, and then follow this:
The table should have the max number of rows
The table should have the max number of columns
rowspan used across table has to add up (more or less)
colspan used across table has to add up (more or less).
Follow that, and after writing the HTML for a few "complex" tables, you'll get the gist of it.
How do I write a Selenium IDE command to verify that the number is present if it increases as I invite more people by email??
For example, the total number of people: 30
Example 1: If I invite 1 person, how do I verify that the total number of people is 31?
Example 2: If I invite 5 people, how do I verify that the total number of people is 35?
Here is the code:
<div style="color:#777; font-size:1.3em; float:right; margin-top:5px;">
Total number of people:
<span style="color:red;">30</span>
I believe you would have to:
Store a value for how many invites you are going to do
Store a value for the expected number of people (ie current plus invites)
Go do the invites
Store a value for the new total number of people
Compare the new number to the expected number
The following does the capturing and comparing of the numbers. You just have to add the part for doing the actual invites.
<tr>
<td>store</td>
<td>5</td>
<td>people_invited</td>
</tr>
<tr>
<td>storeText</td>
<td>//div[contains(text(),'Total number of people')]</td>
<td>original_count_text</td>
</tr>
<tr>
<td>storeEval</td>
<td>parseInt(storedVars['original_count_text'].match(/\d+/))+parseInt(storedVars['people_invited'])</td>
<td>expected_count</td>
</tr>
<tr>
<td>echo</td>
<td>Go invite 5 people</td>
<td></td>
</tr>
<tr>
<td>storeText</td>
<td>//div[contains(text(),'Total number of people')]</td>
<td>new_count_text</td>
</tr>
<tr>
<td>storeEval</td>
<td>parseInt(storedVars['new_count_text'].match(/\d+/))</td>
<td>new_count</td>
</tr>
<tr>
<td>verifyExpression</td>
<td>${expected_count}</td>
<td>${new_count}</td>
</tr>