Link to home
Start Free TrialLog in
Avatar of tommelkonian
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 &amp; 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!important; 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>&ldquo;Amia&rdquo;</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>&ldquo;Leap&rdquo;</td>
   <td>High back, multiple adjustments</td>
   <td>PBI</td>
  </tr>
  <tr>
   <td class="othertablecell" colspan="6"><span class="other"><strong>Other (specify):</strong></span>[Fields:OtherChairstext]</td>
  </tr>
 </tbody>
</table>
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

That can't happen the browser will not do that.

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.
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
Avatar of tommelkonian
tommelkonian

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!!
This question needs an answer!
Become an EE member today
7 DAY FREE TRIAL
Members 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.