basic table padding with html & dreamweaver - dreamweaver

I haven't used DW for a while, excuse my beginners question.
I have created a table with 2 rows & 1 column within HTML. I have inserted an image in to the top row and one image in to the bottom row.
With border, cell padding and cell spacing set to 0, I cannot figure out why I see pixel padding/spacing at the bottom of each cell. I have changed the background colour of the cells in the table to red so that its easy to show the padding.
Changing the vertical alignment for the cells does not change the issue.
I haven't created CSS page for this.
From what I recall in my previous experience with DW padding and spacing was quite simple when creating a basic table in HTML, so not sure where I am going wrong.
Any help would be much appreciated on where I am going wrong here.
Link to the resulting output when i preview the code in safari and/or chrome
https://dl.dropboxusercontent.com/u/13258883/DW.png
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>
<body>
<table width="512" border="0" cellpadding="0" cellspacing="0" >
<tbody>
<tr>
<td colspan="2" bgcolor="#F50408"><img src="images/Untitled-10_01.gif" width="512" height="107" alt=""/></td>
</tr>
<tr>
<td colspan="2" bgcolor="#F50408"><img src="images/Untitled-10_02.gif" width="512" height="93" alt=""/></td>
</tr>
</tbody>
</table>
</body>
</html>

found the answer i add the following code in to the head
<style>
img {
display:block;
}
</style>

Related

Have caption run only as wide as the table on centered table

I'm using XSL-FO with Antennahouse FO formatter.
How do I make the fo:caption in a fo:table-and-caption element run only as wide as the fo:table does?
Essentially, I am looking for the FO equivalent of this HTML:
<?xml version="1.0"?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Image with Caption – CENTERED</title>
</head>
<body>
<div style="border:2px solid blue;">
<table style="border:1px solid green; margin-left:auto; margin-right:auto;">
<caption style="caption-side:bottom; text-align:left; border:1px solid red;"><p style="font-size:9pt;">Sourceline (left edge should match up with table's left edge, and line breaking should occur at right edge of table)</p></caption>
<tr>
<td><p><- The table runs only this wide. -></p></td>
</tr>
</table>
</div>
<p>BLUE = wrapper-DIV</p>
<p>GREEN = table</p>
<p>RED = caption</p>
</body>
</html>
which looks like this:
The XSL-FO code I have is this:
<?xml version="1.0" encoding="UTF-8"?>
<fo:root xmlns:fo="http://www.w3.org/1999/XSL/Format">
<fo:layout-master-set>
<fo:simple-page-master margin-bottom="58px" margin-left="120px" margin-right="120px" margin-top="50px" master-name="content-page" page-height="11in" page-width="8.5in">
<fo:region-body margin-bottom="44px" margin-top="50px" region-name="xsl-region-body" />
</fo:simple-page-master>
</fo:layout-master-set>
<fo:page-sequence master-reference="content-page">
<fo:flow flow-name="xsl-region-body">
<fo:block>
<fo:table-and-caption border="2px solid blue" text-align="center">
<fo:table-caption border="1px solid red" caption-side="bottom">
<fo:block font-size="8pt" text-align="left">Sourceline (left edge should match up with table's left edge, and line breaking should occur at right edge of table)</fo:block>
</fo:table-caption>
<fo:table border="1px solid green">
<fo:table-column/>
<fo:table-body>
<fo:table-row>
<fo:table-cell>
<fo:block><- The table runs only this wide. -></fo:block>
</fo:table-cell>
</fo:table-row>
</fo:table-body>
</fo:table>
</fo:table-and-caption>
</fo:block>
<fo:block>BLUE = fo:table-and-caption</fo:block>
<fo:block>GREEN = fo:table</fo:block>
<fo:block>RED = fo:caption</fo:block>
</fo:flow>
</fo:page-sequence>
</fo:root>
which renders like this:
How do I force (in XSL-FO) the table caption to only run as wide as the table (which might be arbitrarily complex, including e.g. fo:table-footer and table borders on table or cells), and start at the left edge of its associated table (like in the HTML rendering)?

How to get website generated data to excel [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
Do you have any idea how to get this little table from this website to excel?
Normal source code scraping won't work since the results are not stored in the source. Power query doesn't work either...
Edit:
I have tried Power Query. I have some codes that download data from websites searching by class, tag etc. - but all of them search in the source, not in the rendered website, so posting such codes, just to post anything, is pointless.
I know that starting off with web scraping can be sometimes cumbersome and the volume of information out there can be overwhelming so I decided to kickstart your efforts in the hopes that in the future you will at least know where to start from.
Inspect the network traffic.
Use your browser's developer tools to inspect the requests being sent when you browse a website. In your case, the requests that are sent under the hood when you press search are quite a few. However, you only need one of them. It's the XHR request that produces the table as a response.
Inspect the request itself
The request basically consists of a URL which contains the parameters that you select in the dropdown menus, the headers which in your case are not essential to the result and a body which in your case is empty because all the parameters are contained in the URL.
Inspect the response
The response in your case is an HTML. It could have been something else like a JSON. The data you want is in an HTML table with an ID "qoutaTable".
<html>
<head>
<!-- Including version.html for defect CUSTD00035918 Start -->
<meta name="application" content="DDS2-TARIC" />
<meta name="version" content="#REL#" />
<!-- Defect# CUSTD00024730 Start -->
<!-- IPG Rule requires the following 7 metatags in all application pages. Additional metatags e.g. version and application can be added if required by the application. -->
<meta http-equiv="Content-Language" content="en">
<meta name="description" content="DDS2-TARIC Application page">
<meta name="reference" content="DDS2-TARIC Reference">
<meta name="creator" content="DG-TAXUD">
<meta name="classification" content="DDS2-TARIC">
<meta name="keywords" content="DDS2-TARIC, TARIC, DDS2">
<meta name="date" content="">
<!-- Defect# CUSTD00024730 End -->
<!-- Including version.html for defect CUSTD00035918 End -->
</head>
<body style="background-color:#FFFFF0;">
<div id="quotaMarkedUpContainer">
<div class='scroller' id="navigation" align=center>
<table>
<tr>
<td>
</td>
<td>
</td>
</tr>
</table>
</div>
<table id="quotaTable" class="list" width="100%" style="padding-left: 7%; padding-right: 7%;">
<thead>
<tr class="columnHeader">
<th>
Order number
</th>
<th>
Origins
</th>
<th style="text-align: center;">
Start date
</th>
<th style="text-align: center;">
End date
</th>
<th style="text-align: right;">
Balance
</th>
<th/>
</tr>
</thead>
<tr class="oddRow">
<td>
096714
</td>
<td>
<div>
Ukraine
</div>
</td>
<td style="text-align: center;">
01-01-2019
</td>
<td style="text-align: center;">
31-12-2019
</td>
<td style="text-align: right;">
0 Kilogram
</td>
<td>
<a id="quotaLink" href="https://ec.europa.eu/taxation_customs/dds2/taric/quota_tariff_details.jsp?Lang=en&StartDate=2019-01-01&Code=096714" style="color:#3247e8; text-decoration:underline;" class='browse_action_a'>[More info]</a>
</td>
</tr>
</table>
<div class='scroller' id="navigation" align=center>
<table>
<tr>
<td>
</td>
<td>
</td>
</tr>
</table>
</div>
</div>
</body>
</html>
Write the code
For that you will need the following references
Microsoft WinHTTP Services, version 5.1 (to create and manipulate HTTP requests)
Microsoft HTML Object Library (to manipulate HTML elements)
Here's an example of how to get one of the table's cells:
Option Explicit
Sub getData()
Dim req As New WinHttpRequest
Dim doc As New HTMLDocument
Dim table As HTMLTable
Dim url As String, code As String, year As String, origin As String, status As String, critical As String 'the request's parameters
critical = "" 'you can leave it blank if it's not important to your search
status = "" 'you can leave it blank if it's not important to your search
origin = "UA"
year = "2019"
code = "096714"
url = "https://ec.europa.eu/taxation_customs/dds2/taric/quota_list.jsp?Lang=en&Origin=" & origin & "&Code=" & code & "&Year=" & year & "&Status=" & status & "&Critical=" & critical & "&Expand=true&Offset=0" 'build the URL by concatenating the various parameters
With req
.Open "GET", url, False
.send
doc.body.innerHTML = .responseText 'Assign the HTML response to an HTML document object
'Debug.Print .responseText
End With
Set table = doc.getElementById("quotaTable") 'get the table you're interested in
Debug.Print table.Rows(1).Cells(4).innerText 'print the 5th cell of the 2nd row in the immediate window
End Sub
The result looks like that:
For demonstration purposes I'm only showing you how to print the contents of one of the table's cells. You can experiment with the above code and modify it to get access to the other elements of the table as well.
I use Chrome and have the result stored in the source. Then I simply copy the html code to the online html to csv:
Html to csv online editor
It works for me. Or if this is not your solution please try to describe better your problem.

Initialize from html table

I have been trying to make an org chart using the code from this example http://www.getorgchart.com/Demos/Initialize-From-HTML-Table
I am making my table dynamically from xml data (planning to do this for many different xml files so thats why I haven't hardcoded the table). The result does not look right and I'm not sure whats going wrong. I suspect that maybe its trying to make the org chart before my table is made. I have no console errors and I get a plain blue screen with the search bar and arrows when I try to run everything.
Here is my html code:
https://pastebin.com/6b1d0gEC
<body onload="getXML()">
<div id = "conditions"></div>
<div style="float: right; width: 10%; height:100%; text-align:center; display: none;" ></div>
<table id="orgChartData" >
<tr>
<th>title</th>
</tr>
<tr>
Here is my JS code
https://pastebin.com/c7fFerqH
Here is the XML im using to generate the table
https://pastebin.com/0k3xQ5Th

Extracting specific values with Postgresql

I have a table like this:
Table
<!DOCTYPE html>
<html>
<body>
<table border="1" style="width:100%">
<tr>
<td>email</td>
<td>data</td>
</tr>
<tr>
<td>creator_a#creator.com</td>
<td>"vimeo_profile"=>"", "twitter_profile"=>"", "youtube_profile"=>"", "creator_category"=>"production_company", "facebook_profile"=>"", "linkedin_profile"=>"", "personal_website"=>"", "instagram_profile"=>"", "content_expertise_categories"=>"4,5,8"</td>
</tr>
<tr>
<td>creator_b#creator.com</td>
<td>"twitter_profile"=>"", "creator_category"=>"association", "facebook_profile"=>"", "linkedin_profile"=>"", "personal_website"=>"", "content_expertise_type"=>"image", "content_expertise_categories"=>"4, 6"</td>
</tr>
</table>
</body>
</html>
And I want to query this using PostgreSQL, so I only get the values regarding content_expertise_categories:
*Important to mention that the number of values vary. The table has many more entries so I am looking for a solution that helps me extract the values regardless of whether there are 2 or 15 values to pull out.
Result
<!DOCTYPE html>
<html>
<body>
<table border="1" style="width:100%">
<tr>
<td>email</td>
<td>data</td>
</tr>
<tr>
<td>creator_a#creator.com</td>
<td>4,5,8</td>
</tr>
<tr>
<td>creator_b#creator.com</td>
<td>4,6</td>
</tr>
</table>
</body>
</html>
I have tried substring but can't make it to work.
Some help would be much appreciated, thanks!
SELECT
email,
(string_to_array(
data::text,'"content_expertise_categories"=>'::text
)
)[2] as data
FROM users
;
Update:
In your example all strings have "content_expertise_categories" listed last, which allows to think you can just split string to two pieces. If you happen to have more php array definition values after, you'll need an additional split on ',"' and taking [1] part this time...
Mind casting column "data" to ::text before using it in content_expertise_categories function, as it requires text type, and your column appeared to be not such.
I believe more elegant would be this query:
select
email,
data->'content_expertise_categories' as data
from h
;
But when I was posting first query I did not know that you use hstore

JavaFX hide text of column in tableview

I have a tableview and I want to show an image in the first column. My problem is I can't sort the column then. My idea is to set text in the column too and hide the text so it is only for the correct sorting set. Is there a way to do that? Or what other solutions are possible for my problem?
I think this is the perfect example what you wants to do.Still let me know if you have any issue.
Check here
I would have a look at TableColumn.setCellValueFactory() and TableColumn.setCellFactory(). The further is used to provide the actual cell value (used for sorting!), the latter is used to provide the rendering.
In other words: If you need the sort order, you must not change the content, but only the Cell rendering. The methods mentioned above let you do exactly this.
Hope that helps ...
You could do it with just CSS using text-indent. You would also need to set the image as a css background. You did not provide an code of your table, but below is some example:
HTML:
<table width="100%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td class="hidetext image">Text 1</td>
<td>Some text to show</td>
</tr>
<tr>
<td class="hidetext image">Text 2</td>
<td>Some text to show</td>
</tr>
<tr>
<td class="hidetext image">Text 3</td>
<td>Some text to show</td>
</tr>
<tr>
<td class="hidetext image">Text 4</td>
<td>Some text to show</td>
</tr>
</table>
CSS:
.hidetext {text-indent:-9000px}
.image {background:url(http://www.madisoncopy.com/images/jpeg.jpg) no-repeat;}
See how in the left column the text does not show (but it is actually there just indented off the screen).
See this fiddle: http://jsfiddle.net/D297P/

Resources