I have been racking my brain with this for a while and not a single of the fixes I have come across on SO have helped me, so I am reaching out for some help now.
I have a table that is built up of a collection of row pairs that should be combined in a specific way. Below is the html structure I have been using.
<table border=1>
<tr>
<td rowspawn="2">a</td>
<td rowspawn="2">b</td>
<td rowspawn="2">c</td>
<td>d</td>
<td>e</td>
<td>f</td>
<td rowspawn="2">g</td>
<td rowspawn="2">h</td>
</tr>
<tr>
<td colspan="3">def</td>
</tr>
</table>
My understanding is that the cells "d" "e" "f" should have the cell "def" directly under them, however I have the following JSFiddle.
I believe I should see something like this
-------------
| d | e | f |
-------------
| def |
-------------
This doesn't make any sense to me, so any help would be greatly appreciated.
Thanks.
You simply have a mistake in "rowspawn" (it's "rowspan")
<table border=1>
<tr>
<td rowspan="2">a</td>
<td rowspan="2">b</td>
<td rowspan="2">c</td>
<td>d</td>
<td>e</td>
<td>f</td>
<td rowspan="2">g</td>
<td rowspan="2">h</td>
</tr>
<tr>
<td colspan="3">def</td>
</tr>
</table>
Related
I have a requirement in which I have to show quarter months with quarter name on the starting month. For eg.
Q120 Q220
COL1 COL2 COL3 APR-19 MAY-19 JUN-19 JUL-19 AUG-19 SEP19
For that I created two tables, one table to print quarters and other to print other columns and their data.
<table>
<tr>
<td width="70px"></td>
<td width="70px"></td>
<td width="70px"></td>
<td width="210px">Q120</td>
<td width="210px">Q220</td>
</tr>
</table>
<table>
<tr>
<td width="70px">COL1</td>
<td width="70px">COL2</td>
<td width="70px">COL3</td>
<td width="70px">APR-19</td>
<td width="70px">MAY-19</td>
<td width="70px">JUN-19</td>
<td width="70px">JUL-19</td>
<td width="70px">AUG-19</td>
<td width="70px">SEP-19</td>
</tr>
</table>
Whats wrong with my code ? I am NOT getting proper alignment as explained in my example . My quarter row is shifting towards left side ideally Q120 should come above APR-19.
I want to create a table like:
T1----T2----T3
--------------
B1
A1 B2 C1
B3
I'm using the following code:
<table class="table">
<thead>
<tr>
<th>T1</th>
<th>T2</th>
<th>T3</th>
</tr>
</thead>
<tbody>
<tr>
<td rowspan="3">A1</td>
<tr>
<td>B1</td>
<tr>
<td>B2</td>
</tr>
<td>C1</td>
</tr>
</tbody>
</table>
Demo: https://jsfiddle.net/90yegr6f/
I have problems with C1. How to solve this?
You need to focus on doing things one row at a time. Deal with everything in the first row. Then start a new row and deal with everything in that.
So the first row contains A1, B1 and C1.
<tr>
<td>A1
<td>B1
<td>C1
The second row contains only B2
<tr>
<td>B2
and so on.
Now, you want the first and last cells of the first row to span multiple rows:
<tr>
<td rowspan=3>A1
<td>B1
<td rowspan=3>C1
Which gives you:
<table class=table>
<thead>
<tr>
<th>T1
<th>T2
<th>T3
<tbody>
<tr>
<td rowspan=3>A1
<td>B1
<td rowspan=3>C1
<tr>
<td>B2
<tr>
<td>B3
</table>
I want to make table header and table data. But facing problem with width on that two tables different.
Here is the example table :
<table>
<tr>
<td>Name</td>
<td>Class</td>
<td>Phone</td>
</tr>
</table>
and the data here :
<table>
<tr>
<td>John Reise</td>
<td>Math</td>
<td>123456789</td>
<tr>
<td>Michael Sweirzgez</td>
<td>Information Technology</td>
<td>012345678910</td>
<tr>
So when I try to run the code, it will like this :
Name | Class | Phone
John Reise | Math | 123456789
If I delete the data, width will fit with table header.
I make 2 table, 1 table header and 1 table data cause I want to marquee this data. So table header will keep stay in the top.
Maybe you better use thead and tbody tags?
<table>
<thead>
<tr>
<td>Name</td>
<td>Class</td>
<td>Phone</td>
</tr>
</thead>
<tbody>
<tr>
<td>John Reise</td>
<td>Math</td>
<td>123456789</td>
</tr>
<tr>
<td>Michael Sweirzgez</td>
<td>Information Technology</td>
<td>012345678910</td>
</tr>
</tbody>
</table>
You can read more about it here http://www.w3schools.com/tags/tag_thead.asp
You can use thead and tbody. Here are the simple examples:
http://www.w3schools.com/tags/tag_thead.asp
http://www.idocs.com/tags/tables/_THEAD.html
I don't know HTML (HORRIBLY EMBARRASSED but didn't ever have the need to). I am pretty perspicacious when it comes to UNIX however I am horribly confused with this assignment I have. I know what I need to do but am having the hardest time ever getting started.
I have the following files in my hwk12 directory:
roster.html
roster.txt
sample.html
sample.txt
The following is the content of the roster.html file:
<html>
<body>
<table border=2>
<tr><th>Name</th><th>Username</th><th>Email</th></tr>
<tr>
<td>Nikhil Banerjee</td>
<td>nbanerje</td>
<td>zetapsi796#hotmail.com</td>
</tr>
<tr>
<td>Jeff Nazarian</td>
<td>jnazaria</td>
<td>jeff.nazarian#asu.edu</td>
</tr>
<tr>
<td>Anna Melzer</td>
<td>amelzer</td>
<td>anna.melzer#asu.edu</td>
</tr>
<tr>
<td>Jose Garcia</td>
<td>jgarcia</td>
<td>garcia-j#msn.com</td>
</tr>
<tr>
<td>Jillian Testa</td>
<td>jtesta</td>
<td>jillian.testa#asu.edu</td>
</tr>
<tr>
<td>Clayton Lengelzigich</td>
<td>clengelz</td>
<td><a href="mailto:clayton.lengel-zigich#asu.edu">clayton.lengel-
zigich#asu.edu</a></td>
</tr>
<tr>
<td>Ashley Bennett</td>
<td>abennett</td>
<td>ashley.bennett#asu.edu</td>
</tr>
<tr>
<td>Ann Frost</td>
<td>afrost</td>
<td>ann.frost#asu.edu</td>
</tr>
<tr>
<td>Timothy Whipple</td>
<td>twhipple</td>
<td>tweed#asu.edu</td>
</tr>
<tr>
<td>Wei Shen</td>
<td>wshen</td>
<td>shenwei58#hotmail.com</td>
</tr>
<tr>
<td>Cari Mahon</td>
<td>cmahon</td>
<td>cari.mahon#asu.edu</td>
</tr>
<tr>
<td>Alberto Salas</td>
<td>asalas</td>
<td>alberto2504#msn.com</td>
</tr>
<tr>
<td>Dorothy Haskett</td>
<td>dhaskett</td>
<td>dorothy.haskett#asu.edu</td>
</tr>
<tr>
<td>Criss Bradbury</td>
<td>cbradbur</td>
<td>crissbradbury#hotmaiil.com</td>
</tr>
<tr>
<td>Steve Ellermann</td>
<td>sellerma</td>
<td>cis494#ellermann.com</td>
</tr>
<tr>
<td>Zewdie Bekele</td>
<td>zbekele</td>
<td>zewdiea#aol.com</td>
</tr>
<tr>
<td>Frederic Diziere</td>
<td>fdiziere</td>
<td>fsd#asu.edu</td>
</tr>
<tr>
<td>Matt Bowes</td>
<td>mbowes</td>
<td>matt.bowes#asu.edu</td>
</tr>
<tr>
<td>Jasen Meece</td>
<td>jmeece</td>
<td>jasen.meece#sun.com</td>
</tr>
<tr>
<td>Aaron Carpenter</td>
<td>acarpent</td>
<td>aaron.carpenter#asu.edu</td>
</tr>
<tr>
<td>Binqin Xi</td>
<td>bxi</td>
<td>binqin.xi#asu.edu</td>
</tr>
<tr>
<td>Yinting Chan</td>
<td>ychan</td>
<td>yin.chen#asu.edu</td>
</tr>
<tr>
<td>Michael Evans</td>
<td>mevans</td>
<td>michael.evans#asu.edu</td>
</tr>
<tr>
<td>Herman Beringer</td>
<td>hberinge</td>
<td>jber#cox.net</td>
</tr>
<tr>
<td>Andrew Jolley</td>
<td>ajolley</td>
<td>andrew#andrewjolley.com</td>
</tr>
<tr>
<td>Michael Raby</td>
<td>mraby</td>
<td>mike1071#yahoo.com</td>
</tr>
<tr>
<td>Hajar Alaoui</td>
<td>halaoui</td>
<td>hajar6#hotmail.com</td>
</tr>
<tr>
<td>Anne Lemar</td>
<td>alemar</td>
<td>anne.lemar#asu.edu</td>
</tr>
<tr>
<td>Russell Crotts</td>
<td>rcrotts</td>
<td>Russell.Crotts#asu.edu</td>
</tr>
<tr>
<td>Dan Mazzola</td>
<td>dmazzola</td>
<td>dan.mazzola#sun.com</td>
</tr>
<tr>
<td>Bill Boyton</td>
<td>bboyton</td>
<td>boytonb#earthlink.net</td>
</tr>
</table>
</body>
</html>
The following is the content of the roster.txt file:
Whipple Timothy tweed#asu.edu Shen Wei shenwei58#hotmail.com
Mahon Cari cari.mahon#asu.edu Salas Alberto alberto2504#msn.com
Haskett Dorothy dorothy.haskett#asu.edu Bradbury Criss
crissbradbury#hotmaiil.com Ellermann Steve
cis494#ellermann.com Bekele Zewdie zewdiea#aol.com Diziere Frederic
fsd#asu.edu Bowes Matt matt.bowes#asu.edu Meece Jasen
jasen.meece#sun.com Carpenter Aaron aaron.carpenter#asu.edu
Xi Binqin binqin.xi#asu.edu Chan Yinting yin.chen#asu.edu
Evans Michael michael.evans#asu.edu Beringer Herman
jber#cox.net Jolley Andrew andrew#andrewjolley.com Raby Michael
mike1071#yahoo.com Alaoui Hajar hajar6#hotmail.com Lemar Anne
anne.lemar#asu.edu Crotts Russell Russell.Crotts#asu.edu Mazzola Dan
dan.mazzola#sun.com Boyton Bill boytonb#earthlink.net
The following is the content of the sample.html file:
<html>
<body>
<table border=2>
<tr><th>Name</th><th>Username</th><th>Email</th></tr>
<tr>
<td>Michael Raby</td>
<td>mraby</td>
<td>mike1071#yahoo.com</td>
</tr>
<tr>
<td>Hajar Alaoui</td>
<td>halaoui</td>
<td>hajar6#hotmail.com</td>
</tr>
<tr>
<td>Anne Lemar</td>
<td>alemar</td>
<td>anne.lemar#asu.edu</td>
</tr>
<tr>
<td>Russell Crotts</td>
<td>rcrotts</td>
<td>Russell.Crotts#asu.edu</td>
</tr>
<tr>
<td>Dan Mazzola</td>
<td>dmazzola</td>
<td>dan.mazzola#sun.com</td>
</tr>
<tr>
<td>Bill Boyton</td>
<td>bboyton</td>
<td>boytonb#earthlink.net</td>
</tr>
</table>
</body>
</html>
The following is the content of the sample.txt file:
Raby Michael mike1071#yahoo.com
Alaoui Hajar hajar6#hotmail.com
Lemar Anne anne.lemar#asu.edu
Crotts Russell Russell.Crotts#asu.edu
Mazzola Dan dan.mazzola#sun.com
Boyton Bill boytonb#earthlink.net
I'm not asking for someone to do this for me because I LOVE UNIX and I want to learn it myself. Everytime I look at this HTML code I am confusing the #$$#& out of myself. I need help getting started.
The homework prompt is the following:
You are to write a nawk(1) script called ~/hwk12/mk_html.awk that converts a text file (sample.txt and roster.txt) to an html page that a web browser can read. I have given you the output in the file sample.html which is reproduced below (notice how each level of indentation is two spaces deep):
Again, I don't want someone to do this for me. Im just confused as to how data in the text file will append to the HTML table without the actual HTML code. Can someone please help me get started?
Looks like you'll need to define the necessary HTML tags within your script. The meat of the html file will be these lines:
<tr>
<td>$first $last</td>
<td>$username</td>
<td>$email</td>
</tr>
These tags define a table row. You can parse the variables from the text files with awk and use them to fill in the html. The other html markup can be copy-pasted as static text into the output html file.
Edit: You can do this to grab the first and last name and print to the html file.
last = $1
first = $2
print " <tr>"
print " <td>" first " " last "</td>"
print " </tr>"
You just need to expand that to get the email and username.
Please, either look at http://jsfiddle.net/mawg/pL9kd/ or stick the code below into your favourite HTML editor ...
Look to the right of OMG! Item 4 contains a *nested* array. (How) can I get that nested array (xyz) to be 2 columns wide, even if its content doesn't need so much space?
<table border="1" cellpsacing="0" cellpadding="0" style="">
<tr><th style="border-width:1" colspan="3">This is an array</th></tr>
<td colspan="2">
<table border="1">
<tr><td colspan="3">Array</td></tr>
<tr>
<td>item 1</td>
<td>string ( 3 chars)</td>
<td>abc</td>
</tr>
<tr>
<td>0</td>
<td>string ( 25 chars)</td>
<td>item 2 is indexed by zer0</td>
</tr>
<tr>
<td>this equals seven</td>
<td>integer</td>
<td>7</td>
</tr>
<tr>
<td>item 4 is a nested array</td>
<td colspan="2">
<table border="1">
<tr><td colspan="3">Array</td></tr>
<tr>
<td>0</td>
<td>string ( 24 chars)</td>
<td>item 4, offest 0's value</td>
</tr>
<tr>
<td>OMG! Item 4 contains a *nested* array F5</td>
<td colspan="2">
<table border="1">
<tr><td colspan="3">Array</td></tr>
<tr>
<td>xyz</td>
<td>string ( 7 chars)</td>
<td>xyz val</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>item 4, offest 2 is True</td>
<td>boolean</td>
<td>True</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>final item</td>
<td colspan="2">NULL</td>
</tr>
</table>
</td>
</table>
Do you mean like this? http://jsfiddle.net/pL9kd/8/
(Width = 100%)
Check this you can use the width, to set to width='66%' which works since you know there are 3 columns and 2/3 is 66%. Also set the containing table to width='100%' since you are going to need all of the possible space.
From what I could find there is nothing like what your asking (or at least my interpretation of it). Could you not simply create a column width equaling two total columns?
So something like
<td width="40">xyz</td>
I could be way off but that's just my guess. Just curious, what is the implementation for this? I am sure you know css lists and other css elements are much more efficient at styling, correct?