Table display differs between Firefox & Chrome Topic is solved

General questions relating to Joomla! 3.x.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting.
Forum Post Assistant - If you are serious about wanting help, you should use this tool to help you post.
Post Reply
bobinski
Joomla! Intern
Joomla! Intern
Posts: 81
Joined: Mon Aug 26, 2019 12:24 pm
Contact:

Table display differs between Firefox & Chrome

Post by bobinski » Thu Sep 12, 2019 6:49 am

I have added a table to an article. The html Joomla! generates is :-

Code: Select all

<div itemprop="articleBody">
		<table style="height: 99px; width: 891px;">
<tbody>
<tr>
<td style="width: 275.033px;">This site</td>
<td style="width: 180.967px;">Original Site</td>
</tr>
<tr>
<td style="width: 275.033px;"><a href="/5G/bioinitiative-report-2012-summary-highlights.pdf?download" target="_blank" rel="noopener noreferrer">BioInitiative report 2012 - summary highlights</a></td>
<td style="width: 180.967px;"><a href="https://michaelhollihn.files.wordpress.com/2013/01/bioinitiative-report-2012-summary-highlights.pdf" target="_blank" rel="noopener noreferrer">michaelhollihn.files.wordpress.com</a></td>
</tr>
<tr>
<td style="width: 275.033px;"><a href="/5G/peer-reviewed-scientific-studies-on-emf-related-subjects.docx?download" target="_blank" rel="noopener noreferrer">Peer-reviewed scientific studies on EMF related subjects</a></td>
<td style="width: 180.967px;"><a href="https://www.powerwatch.org.uk/science/studies.asp" target="_blank" rel="noopener noreferrer">www.powerwatch.org.uk</a></td>
</tr>
<tr>
<td style="width: 275.033px;"> </td>
<td style="width: 180.967px;"> </td>
</tr>
</tbody>
</table> 	</div>
The css from the protostar template (line: 1694) :-

Code: Select all

table {
	max-width: 100%;
	background-color: transparent;
	border-collapse: collapse;
	border-spacing: 0;
}
.table {
	width: 100%;
	margin-bottom: 18px;
}
In Firefox the table is correctly constrained to the width of the articleBody but in Chrome it is not.

Does anyone know of a work round for this Chrome failure to action width: 100% on a table?

bobinski
Joomla! Intern
Joomla! Intern
Posts: 81
Joined: Mon Aug 26, 2019 12:24 pm
Contact:

Re: Table display differs between Firefox & Chrome

Post by bobinski » Thu Sep 12, 2019 6:52 am

I'm on Version 76.0.3809.132 (Official Build) (64-bit), but when I went to the About Chrome window it went to updating.

Now it's updated and relaunched to Version 77.0.3865.75 (Official Build) (64-bit) it's working!

gws
Joomla! Virtuoso
Joomla! Virtuoso
Posts: 3943
Joined: Tue Aug 23, 2005 1:56 pm
Location: South coast, UK
Contact:

Re: Table display differs between Firefox & Chrome

Post by gws » Thu Sep 12, 2019 7:13 am

Try using % instead of px for width definitions.i.e. <td style="width: 33%;">
Infinitely better to use <div> instead of tables if you can as tables are not truly responsive.
edit, I see you have a solution....


Post Reply

Return to “General Questions/New to Joomla! 3.x”