Is there HTML tag like Div but doesn't interupt other Divs

Question

I am trying to make a table of cells where a few can be logically grouped together and when hovered over they change color.

I started using a HTML tagged table but quickly learnt you cannot nest divs or spans inside, so it would have meant assigning each individual cell (256 cells) a class and possibly a javascript function or two.

I went with a div constructed table and it seemed better at first, however trying to logically group cells causes the table to get all messed up:

The end goal is of 256 cells some of them may be stringed together, for example cells 16-31 (entire second row) or cells 30-33 (first few cells of another row). Each group of cells will have a color and the entire group will change color when any of the cells are hovered over.

My main question is, is there an "invisible" html tag that won't get put around the place (without that id "special" div, the table layout is as expected). So far I have tried div (pictured), span and section. Alternatively a better suggested solution would also be helpful.

body {
  font-family: Consolas, Courier New, Courier, monospace;
}
.divTable {
  border: 2px solid #999999;
  display: table;
  width: auto;
}
.divTableRow {
  display: table-row;
}
.divTableCell,
.divTableHead {
  vertical-align: middle;
  text-align: center;
  border: 1px solid #999999;
  display: table-cell;
  height: 25px;
  width: 25px;
  /*padding: 3px;*/
}
.divTableHeading {
  background-color: beige;
  font-weight: bold;
}
.divTableBody {
  display: table-row-group;
}
/*  */

/*  */

/*  */

.divTableCell {
background-color: green;
}

#special .divTableCell {
background-color: red;
}

body {
  font-family: Consolas, Courier New, Courier, monospace;
}
th {
  background-color: beige;
}
.divTableCell:hover {
  cursor: pointer;
}
.endrow .divTableCell:hover,
.divTableHeading .divTableCell:hover {
  cursor: default;
}
.endrow,
.reserved {
  background-color: lightpink;
}
/*.reserved:hover {
        background-color: red;
    }*/

<div class="divTable">
  <div class="divTableBody">
    <div class="divTableRow divTableHeading">
      <div class="divTableCell">+</div>
      <div class="divTableCell">00</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">16</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">32</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">48</div>
<div id="special">
      <div class="divTableCell">30</div>
      <div class="divTableCell">31</div>
      <div class="divTableCell">32</div>
      <div class="divTableCell">33</div>
</div>
      <div class="divTableCell">34</div>
      <div class="divTableCell">35</div>
      <div class="divTableCell">36</div>
      <div class="divTableCell">37</div>
      <div class="divTableCell">38</div>
      <div class="divTableCell">39</div>
      <div class="divTableCell">3A</div>
      <div class="divTableCell">3B</div>
      <div class="divTableCell">3C</div>
      <div class="divTableCell">3D</div>
      <div class="divTableCell">3E</div>
      <div class="divTableCell">3F</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow endrow">
      <div class="divTableCell divTableHeading">256</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
  </div>
</div>

http://stackoverflow.com/questions/4746061/div-table-colspan-how — mplungjan, Jan 31 '17 at 16:07
@mplungjan I am in the middle of editing it, it is not the full code yet, and it won't let me save the edits anymore because you made a change :( — lozzajp, Jan 31 '17 at 16:13
@mplungjan it is edited now, I want to "logically" group 30-33 in the above example so I can just then assign a background color etc. to them all, but instead it also changes the visual layout. — lozzajp, Jan 31 '17 at 16:15
I think a lot of people would have trouble understanding what your end goal here is. What are you trying to accomplish? — Adjit, Jan 31 '17 at 16:16
@Adjit I am trying to logically group some cells so I can single them out for background coloring etc. I will edit my CSS and question a bit more clearer. — lozzajp, Jan 31 '17 at 16:17
What do you mean by logically group? Like the user clicks on a bunch of cells and it highlights them? — Adjit, Jan 31 '17 at 16:17
@Adjit The end goal is by hover, I have updated the CSS a bit so it is colored. By grouping them 4 together to color them at once it then throws the table layout into a bad state. — lozzajp, Jan 31 '17 at 16:19
Why not just change the classname of the special content without wrapping it? — mplungjan, Jan 31 '17 at 16:20
Because that could involve up to 256 individual edits and tracking etc. I may also need to put in some JS functions later on. — lozzajp, Jan 31 '17 at 16:22
Still not understanding exactly what you want... ok you hover over one cell, but you want to highlight 4 cells? or each cell you hover over change it's color and keep it changed? You have to explain what action it is you are trying to go through — Adjit, Jan 31 '17 at 16:22
@Adjit I updated my question explaining it a bit more, what you said first. Say those 4 cells are "grouped" then yes hovering over any of them then all 4 should change color as if they were a single entity. — lozzajp, Jan 31 '17 at 16:27
Short answer: no, there's no 'invisible' `
` alternative. So, the answer would be to use JavaScript (whether the DOM API, or via a library such as jQuery) to use class-names (or other, such as `data-*`, attributes) to perform the 'grouping.' That said, though, is it tabular data you're presenting? Because, if so, it may be easier to simply use a ``. — David Thomas, Jan 31 '17 at 16:31

mplungjan · Accepted Answer · 2017-01-31T20:47:41.027

Using jQuery or similar to find the 38th row and highlight the special divs - do note I did not use the ID but just added a class. IDs must be unique.

Now no need to wrap in special divs. All changes are in the object I called highlight

$(function() {
  var highlight = { "row":"48", "cells":[1,2,3,5] }
  var cells = $(".divTableHeading:contains('"+highlight.row+"')").siblings();
  $.each(highlight.cells,function(_,i) {
    cells.eq(i).addClass("special")
  });
  $(".divTable .special").hover(function() {
    $(this).toggleClass("reserved");
  });
});

body {
  font-family: Consolas, Courier New, Courier, monospace;
}
.divTable {
  border: 2px solid #999999;
  display: table;
  width: auto;
}
.divTableRow {
  display: table-row;
}
.divTableCell,
.divTableHead {
  vertical-align: middle;
  text-align: center;
  border: 1px solid #999999;
  display: table-cell;
  height: 25px;
  width: 25px;
  /*padding: 3px;*/
}
.divTableHeading {
  background-color: beige;
  font-weight: bold;
}
.divTableBody {
  display: table-row-group;
}
/*  */

/*  */

/*  */

.divTableCell {
background-color: green;
}

.special  {
background-color: red;
}

body {
  font-family: Consolas, Courier New, Courier, monospace;
}
th {
  background-color: beige;
}
.divTableCell:hover {
  cursor: pointer;
}
.endrow .divTableCell:hover,
.divTableHeading .divTableCell:hover {
  cursor: default;
}
.endrow,
.reserved {
  background-color: lightpink;
}
/*.reserved:hover {
        background-color: red;
    }*/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="divTable">
  <div class="divTableBody">
    <div class="divTableRow divTableHeading">
      <div class="divTableCell">+</div>
      <div class="divTableCell">00</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">16</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">32</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">48</div>
      <div class="divTableCell">30</div>
      <div class="divTableCell">31</div>
      <div class="divTableCell">32</div>
      <div class="divTableCell">33</div>
      <div class="divTableCell">34</div>
      <div class="divTableCell">35</div>
      <div class="divTableCell">36</div>
      <div class="divTableCell">37</div>
      <div class="divTableCell">38</div>
      <div class="divTableCell">39</div>
      <div class="divTableCell">3A</div>
      <div class="divTableCell">3B</div>
      <div class="divTableCell">3C</div>
      <div class="divTableCell">3D</div>
      <div class="divTableCell">3E</div>
      <div class="divTableCell">3F</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow endrow">
      <div class="divTableCell divTableHeading">256</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
  </div>
</div>

I was hoping to avoid JS but this looks promising thank you. Just having trouble getting it going, literally copied your lot, linked in the CSS and JS file and the jQuery link etc. still not assigning the classes. — lozzajp, Jan 31 '17 at 17:00
my scripts were above the code, so I needed to wrap the JS in the usual `.ready()` function. — lozzajp, Jan 31 '17 at 17:25
You could do the whole thing as an object and generate the divs in the fly — mplungjan, Jan 31 '17 at 17:29
I am going for this as a solution, I was hoping to keep JS separate and using html/css for the display of the table etc. but this is going to work well, such as your `var highlight = { "row":"48", "cells":[1,2,3,5] };` can be used to hold sections of cells as objects. — lozzajp, Jan 31 '17 at 18:12
It can be an array of rows with arrays of cells to highlight — mplungjan, Jan 31 '17 at 18:21
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/134523/discussion-between-lozzajp-and-mplungjan). — lozzajp, Jan 31 '17 at 20:19

G-Cyrillus · Answer 2 · 2017-01-31T17:08:17.343

My main question is, is there an "invisible" html tag that won't get put around the place

Answer is Yes, CSS should provide it, ... but:

For firefox you could use (https://samrueby.com/2015/02/09/firefox-is-releasing-support-for-css-display-contents/ )

display:contents;

<display-box>

These values define whether an element generates display boxes at all.
Value     Description
contents These elements don't produce a specific box by themselves. They are replaced by their pseudo-box and their child boxes.

none Turns off the display of an element (it has no effect on layout); all descendant elements also have their display turned off. The document is rendered as though the element did not exist.

To render an element box's dimensions, yet have its contents be invisible, see the visibility property.

for the other one ,you'll need jquery to clone child and remove #special . You will also need to add a class if you need special styling :

$('#special>div').clone().insertAfter('#special').addClass( "special" );
$('#special').remove();

Demo below:

// for none firefox browsers 
$('#special>div').clone().insertAfter('#special').addClass( "special" );
$('#special').remove();
$( ".divTableCell" ).each(function() {
  $('.special' ).addClass( "hover" );
});

#special {
  display:contents;
}

#special .divTableCell ,.divTable .special{
background-color: red;
}
.divTable:hover .special.hover {background:turquoise;}


body {
  font-family: Consolas, Courier New, Courier, monospace;
}
.divTable {
  border: 2px solid #999999;
  display: table;
  width: auto;
}
.divTableRow {
  display: table-row;
}
.divTableCell,
.divTableHead {
  vertical-align: middle;
  text-align: center;
  border: 1px solid #999999;
  display: table-cell;
  height: 25px;
  width: 25px;
  /*padding: 3px;*/
}
.divTableHeading {
  background-color: beige;
  font-weight: bold;
}
.divTableBody {
  display: table-row-group;
}
/*  */

/*  */

/*  */

.divTableCell {
background-color: green;
}



body {
  font-family: Consolas, Courier New, Courier, monospace;
}
th {
  background-color: beige;
}
.divTableCell:hover {
  cursor: pointer;
}
.endrow .divTableCell:hover,
.divTableHeading .divTableCell:hover {
  cursor: default;
}
.endrow,
.reserved {
  background-color: lightpink;
}
/*.reserved:hover {
        background-color: red;
    }*/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="divTable">
  <div class="divTableBody">
    <div class="divTableRow divTableHeading">
      <div class="divTableCell">+</div>
      <div class="divTableCell">00</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">16</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">32</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">48</div>
<div id="special">
      <div class="divTableCell">30</div>
      <div class="divTableCell">31</div>
      <div class="divTableCell">32</div>
      <div class="divTableCell">33</div>
</div>
      <div class="divTableCell">34</div>
      <div class="divTableCell">35</div>
      <div class="divTableCell">36</div>
      <div class="divTableCell">37</div>
      <div class="divTableCell">38</div>
      <div class="divTableCell">39</div>
      <div class="divTableCell">3A</div>
      <div class="divTableCell">3B</div>
      <div class="divTableCell">3C</div>
      <div class="divTableCell">3D</div>
      <div class="divTableCell">3E</div>
      <div class="divTableCell">3F</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow">
      <div class="divTableCell divTableHeading">0</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
    <div class="divTableRow endrow">
      <div class="divTableCell divTableHeading">256</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
      <div class="divTableCell">&nbsp;</div>
    </div>
  </div>
</div>

Codepen to play with : uncomment jquery script if not running under firefox

My code works without cloning or special treatments of some browsers — mplungjan, Jan 31 '17 at 16:35
@mplungjan yep, but you change the HTML :) , i did not touch it and brought some info about https://samrueby.com/2015/02/09/firefox-is-releasing-support-for-css-display-contents/ . Beside my jQuery is a fallback for browser not supporting display:contents yet :) — G-Cyrillus, Jan 31 '17 at 16:36
I did NOT change the _original_ HTML - I removed the div he was unhappy about: _Alternatively a better suggested solution would also be helpful._ :) — mplungjan, Jan 31 '17 at 16:39

Is there HTML tag like Div but doesn't interupt other Divs

2 Answers2