tommelkonian
asked on
Why is browser changing my rowspan from "3" to "4" ??
I've got a weird issue where a rowspan which I've set is being changed by the browsers. I set rowspan="3" and browser renders rowspan="4" ( which I can see when I inspect the browser code).
I'm trying to achieve a 6x6 table , where the second row (under the heading row) and 6th row are colspan="6" (full width), and the left cell of rows 3-5 is a single row with rowspan="3" , but for some reason the browser keeps bumping it up to "4" ( and causing the bottom row to not cover the full width)
This is running inside the DNN Action Form module html template.
here's a nippet as an example.
Thanks,
Tom
<table class="table table-bordered" id="equipTable">
<thead>
<tr>
<th>Item</th>
<th>Product Image</th>
<th>Manufacturer</th>
<th>Name, Catalog or Model #</th>
<th>Description & Comments</th>
<th>Vendor</th>
</tr>
</thead>
<tbody id="chairs-tbody" style="max-width: 769px;">
<tr class="ergo-headingtr">
<th class="singlerow" colspan="6">Chairs</th>
</tr>
<tr>
<td class="checkboxColumn" id="chairsColumn" rowspan="3" style="padding:0px!importa nt; vertical-align:top; ">[Fields:Chairs]</td>
<td><img alt="" class="ergo-img" src="/Portals/0/County/GSD /Ergo_Form /image018. png" /></td>
<td>Office Master</td>
<td>YS 84</td>
<td>Medium Mesh back, multiple adjustments, armrests optional</td>
<td>Palace Arts</td>
</tr>
<tr>
<td class="bluemobilebg"><img alt="" class="ergo-img" src="/Portals/0/County/GSD /Ergo_Form /image004. png" /></td>
<td>Steelcase</td>
<td>“Amia”</td >
<td>County standard office task chair; high back, seat depth adjustment</td>
<td>PBI</td>
</tr>
<tr>
<td><img alt="" class="ergo-img" src="/Portals/0/County/GSD /Ergo_Form /image008. png" /></td>
<td>Steelcase</td>
<td>“Leap”</td >
<td>High back, multiple adjustments</td>
<td>PBI</td>
</tr>
<tr>
<td class="othertablecell" colspan="6"><span class="other"><strong>Othe r (specify):</strong></span> [Fields:Ot herChairst ext]</td>
</tr>
</tbody>
</table>
I'm trying to achieve a 6x6 table , where the second row (under the heading row) and 6th row are colspan="6" (full width), and the left cell of rows 3-5 is a single row with rowspan="3" , but for some reason the browser keeps bumping it up to "4" ( and causing the bottom row to not cover the full width)
This is running inside the DNN Action Form module html template.
here's a nippet as an example.
Thanks,
Tom
<table class="table table-bordered" id="equipTable">
<thead>
<tr>
<th>Item</th>
<th>Product Image</th>
<th>Manufacturer</th>
<th>Name, Catalog or Model #</th>
<th>Description & Comments</th>
<th>Vendor</th>
</tr>
</thead>
<tbody id="chairs-tbody" style="max-width: 769px;">
<tr class="ergo-headingtr">
<th class="singlerow" colspan="6">Chairs</th>
</tr>
<tr>
<td class="checkboxColumn" id="chairsColumn" rowspan="3" style="padding:0px!importa
<td><img alt="" class="ergo-img" src="/Portals/0/County/GSD
<td>Office Master</td>
<td>YS 84</td>
<td>Medium Mesh back, multiple adjustments, armrests optional</td>
<td>Palace Arts</td>
</tr>
<tr>
<td class="bluemobilebg"><img alt="" class="ergo-img" src="/Portals/0/County/GSD
<td>Steelcase</td>
<td>“Amia”</td
<td>County standard office task chair; high back, seat depth adjustment</td>
<td>PBI</td>
</tr>
<tr>
<td><img alt="" class="ergo-img" src="/Portals/0/County/GSD
<td>Steelcase</td>
<td>“Leap”</td
<td>High back, multiple adjustments</td>
<td>PBI</td>
</tr>
<tr>
<td class="othertablecell" colspan="6"><span class="other"><strong>Othe
</tr>
</tbody>
</table>
I would hazard a very unsophisticated guess that you have a CSS sytle sheet that is playing with what get's to the browser.. I have been bit by this way before-- Review your Hierarchy for Applying Styles to HTML .
https://www.w3schools.com/css/css_specificity.asp
https://www.w3schools.com/css/css_specificity.asp
ASKER
Thanks - You were both correct. I had some javascript running which was messing with the page (not sure the details,) Removing that fixed the issue.
Thanks again!!
Thanks again!!
This question needs an answer!
Become an EE member today
7 DAY FREE TRIALMembers can start a 7-Day Free trial then enjoy unlimited access to the platform.
View membership options
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
I have put your code in a test file and confirmed it - so something else is going on - which we are not going to deduce from the code.
You will need to show us a link where it is happening.