firefox和chrome之间的Css差异

时间:2017-08-25 08:50:27

标签: html css

我的css在firefox上运行正常,但是Chrome有一些问题,正如你所看到的,tr是不完整的。

你知道如何调试这个吗?

火狐:

mozilla

chrome

这是相应的html

<tbody>
<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
        <td colspan="2"></td>
        <td colspan="7"></td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
    <td colspan="3">↓</td>
    <td>- Km</td>
    <td>- min</td>
    <td></td>
</tr>

<tr class="content_6 1861454 firstEnquete firstContent" style="display: table-row;">
    <td class="pdvTaille2">
        ITM0013 - INTERMARCHE ESPERE-SUPER-DRIVE <br>
        RD 911 "LES GRANGES" - 46090 - ESPERE
    </td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
      <td colspan="3">↓</td>
      <td>- Km</td>
      <td>- min</td>
      <td></td>
</tr>                                      

<tr>
    <td colspan="9" class="listeEnquetes"></td>
</tr>

<tr class="content_6 1848673 firstEnquete firstContent" style="display: table-row;">
    <td class="pdvTaille2">
        ITM0004 - INTERMARCHE VIEUX-VY-SUR-COUESNON-SUPER-DRIVE <br>
        Z.A. LA CROIX COUVERTE - 35490 - VIEUX-VY-SUR-COUESNON
    </td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
    <td colspan="3">↓</td>
    <td>- Km</td>
    <td>- min</td>
    <td></td>
</tr>                                       

<tr>
    <td colspan="9" class="listeEnquetes"></td>
</tr>

<tr class="content_6 1848727 firstEnquete firstContent" style="display: table-row;">
    <td class="pdvTaille2">
        ITM0005 - INTERMARCHE BROONS-SUPER-DRIVE <br>
        PA DU CHALET - 22250 - BROONS
    </td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
    <td colspan="3">↓</td>
    <td>- Km</td>
    <td>- min</td>
    <td></td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
    <td colspan="2"></td>
    <td colspan="7"></td>
</tr>
</tbody>

感谢您的帮助,如果您需要,我可以添加一些Css,但可能没有用来展示一切。希望你可能有一个想法,其他导航器存在一些其他问题,但之前存在,所以我只想关注那个。

PS:这是控制台中生成的代码,但它是用twig构建的。

1 个答案:

答案 0 :(得分:0)

你刚才没有提到该行中空单元格的任何内容
在第一行中,你使用colspan="2"colspan="7"表示完整的行,在第三行中你有刚刚使用<td></td>左侧第一行中有9列,第三行只有一列。

我根据自己的方便做了一些改变,但我不知道同样会对你有用,但主要的概念是第一行中使用的<td> su的数量,包括colspan u必须根据您的要求在后续行中保持相同数量的cols。
如果这个答案不清楚,或者你在任何时候都不明白,请问我能解释一下。

<table><tbody>
<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
        <td colspan="4"></td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
    <td>↓</td>
    <td>- Km</td>
    <td>- min</td>
    <td></td>
</tr>

<tr class="content_6 1861454 firstEnquete firstContent" style="display: table-row;">
    <td class="pdvTaille2" colspan="4">
        ITM0013 - INTERMARCHE ESPERE-SUPER-DRIVE <br>
        RD 911 "LES GRANGES" - 46090 - ESPERE
    </td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
      <td>↓</td>
      <td>- Km</td>
      <td>- min</td>
      <td></td>
</tr>                                      

<tr>
    <td colspan="4" class="listeEnquetes"></td>
</tr>

<tr class="content_6 1848673 firstEnquete firstContent" style="display: table-row;">
    <td class="pdvTaille2" colspan="4">
        ITM0004 - INTERMARCHE VIEUX-VY-SUR-COUESNON-SUPER-DRIVE <br>
        Z.A. LA CROIX COUVERTE - 35490 - VIEUX-VY-SUR-COUESNON
    </td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
    <td>↓</td>
    <td>- Km</td>
    <td>- min</td>
    <td></td>
</tr>                                       

<tr>
    <td colspan="4" class="listeEnquetes"></td>
</tr>

<tr class="content_6 1848727 firstEnquete firstContent" style="display: table-row;">
    <td class="pdvTaille2" colspan="4">
        ITM0005 - INTERMARCHE BROONS-SUPER-DRIVE <br>
        PA DU CHALET - 22250 - BROONS
    </td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
    <td>↓</td>
    <td>- Km</td>
    <td>- min</td>
    <td></td>
</tr>

<tr class="content_6 firstEnquete firstContent" style="display: table-row;">
    <td colspan="4"></td>
</tr>
</tbody>
</table>