边界在IE 10中不起作用

时间:2017-02-01 19:46:35

标签: html css3 internet-explorer less user-interaction

我有一张桌子,我想在我的TH元素上放置右边框,但奇怪的是没有在IE 10上工作。

我之所以使用两个表是因为这个网格是动态的,可以更新值,也可以从UI端创建行,同时从后端读取数据。它完全与chrome合作,但为了使IE具有可比性,我面临着一些挑战。

代码HTML

    <div id="consulta-cartera-grid-container" class="grid-container ui-widget ui-corner-all container-border" style="width:100%;font-size:11px;border-top:1px solid #949494;border-radius:6px;">
   <div id="gridconsultaGridParams-grid-mask" style="overflow:hidden">
      <div id="gridconsultaGridParams-grid-toolbar" class="button-bar" style="padding: 2px;border-top: none: ;"></div>
      <div id="gridconsultaGridParams-grid-header" class="grid-header">
         <table style="height: 18px;overflow: hidden;display: inline-table;" id="gridconsultaGridParams-grid-header-table" class="grid-table">
            <thead id="gridconsultaGridParams-header-row" class="header-row">
               <tr id="gridconsultaGridParams-grid-header-text">
                  <th style="display:none;" id="gridconsultaGridParams-idHES" class="  " nowrap="">idHistorialEstadoSolicitud</th>
                  <th key="fechaCreacion" id="gridconsultaGridParams-fechaHES" class="  " nowrap="">Fecha</th>
                  <th key="descActividadFlujo" id="gridconsultaGridParams-actividadHES" class="  " nowrap="">Actividad</th>
                  <th key="descEstadoSolicitud" id="gridconsultaGridParams-estadoHES" class="  " nowrap="">Estado</th>
                  <th key="matriculaCreador" id="gridconsultaGridParams-usuarioHES" class="  " nowrap="">Usuario</th>
                  <th key="descTipoJustificacion" id="gridconsultaGridParams-justificacionHES" class="  " nowrap="">Deuda</th>
               </tr>
            </thead>
            <tbody id="gridconsultaGridParams-hidden-body" class="grid-table-body">
               <tr>
                  <td colspan="6" nowrap="">No existen registros.</td>
               </tr>
            </tbody>
            <tbody></tbody>
         </table>
      </div>
      <div id="gridconsultaGridParams-grid-body" class="grid-body" gridid="gridconsultaGridParams" style=";min-height:20px;max-height:400px">
         <table id="gridconsultaGridParams-grid-body-table" class="grid-table">
            <thead id="gridconsultaGridParams-hidden-header" class="header-row">
               <tr id="gridconsultaGridParams-grid-header-text-hidden">
                  <th style="display:none;" id="gridconsultaGridParams-idHES" class="  " nowrap="">idHistorialEstadoSolicitud</th>
                  <th key="fechaCreacion" id="gridconsultaGridParams-fechaHES" class="  " nowrap="">Fecha</th>
                  <th key="descActividadFlujo" id="gridconsultaGridParams-actividadHES" class="  " nowrap="">Actividad</th>
                  <th key="descEstadoSolicitud" id="gridconsultaGridParams-estadoHES" class="  " nowrap="">Estado</th>
                  <th key="matriculaCreador" id="gridconsultaGridParams-usuarioHES" class="  " nowrap="">Usuario</th>
                  <th key="descTipoJustificacion" id="gridconsultaGridParams-justificacionHES" class="  " nowrap="">Deuda</th>
               </tr>
            </thead>
            <tbody id="gridconsultaGridParams-grid-table-body" class="grid-body">
               <tr>
                  <td colspan="6" nowrap="">No existen registros.</td>
               </tr>
            </tbody>
         </table>
      </div>
   </div>
</div>

我的CSS:

.grid-table th {
  box-sizing: border-box;
  border-right-style: solid;
  border-right-color: #FFFFFF;
  border-right-width: 5px;
  font-weight: bold;
  padding: 1px 15px 1px 5px;
  min-width: 16px;
  height: 18px;
  color: #FFF;
  position: relative;
}

只添加不起作用的CSS的重要部分

0 个答案:

没有答案