how to make a whole row in a table clickable as a link?

Question

I\'m using Bootstrap and the following doesn\'t work:

    
        
            Blah Blah
           


        

Answer 1

A linked table row is possible, but not with the standard

elements. You can do it using the display: table style properties. Here and here are some fiddles to demonstrate.

This code should do the trick:

.table {
  display: table;
}

.row {
  display: table-row;
}

.cell {
  display: table-cell;
  padding: 10px;
}

.row:hover {
  background-color: #cccccc;
}

.cell:hover {
  background-color: #e5e5e5;
}

  

    

      1.1
    
    

      1.2
    
    

      1.3
    
  

  
    

      2.1
    
    

      2.2
    
    

      2.3
    
  

Note that ARIA roles are needed to ensure proper accessibility since the standard

elements are not used. You may need to add additional roles like role="columnheader" if applicable. Find out more at the guide here.

0 讨论(0)

查看其它26个回答

发布评论:

提交评论

---

•  加载中...

验证码

 看不清?

提交回复

热议问题