Ok so I have the following code for a table with CSS rules designed to "collapse the table horizontally" on smaller screens...
<table>
<thead class="thead">
<tr>
<th>a</th>
<th>b</th>
<th>c</th>
<th>d</th>
<th>e</th>
<th>f</th>
<th>g</th>
</tr>
</thead>
<tbody>
<tr>
<td data-label="a">1</td>
<td data-label="b">2</td>
<td data-label="c">3</td>
<td data-label="d">4</td>
<td data-label="e">5</td>
<td data-label="f">6</td>
<td data-label="g">
<div class="class1">
<button type="button" class="btn">
<span class="btn_span">btn</span><span class="caret"></span>
</button>
<ul class="class2">
<li></li>
<li></li>
</ul>
</div>
</td>
</tr>
</tbody>
</table>
It works perfectly when saved as a .html file, however when the exact same code is saved as a .php file (just change file extension,) it fails to collapse correctly on smaller screens.
So my question is... What would make this identical code work perfectly as a html file but not as a php file?
Something to do with encoding I am guessing, but I just cant figure it out and I have wasted so much time on it. If I check the source code of the php version it is exactly the same as the html version.
Anyone come across simalar issues where html works as a html file but not as a php file?