当行引导表中有图像时，将文本对齐到中间-AligntextinmiddlewhenthereisaimageinarowBootstraptable

I have a bootstrap table, but I can't seem to get the text to align in the middle because the image expands the row.

我有一个引导表，但是我不能让文本对齐到中间，因为图像扩展了行。

I have tried adding vertical-align: middle to .table in my CSS, but it doesn't seem to do anything.

我尝试过在我的CSS中添加垂直对齐:中间到。table，但是它似乎没有任何作用。

Example

https://jsfiddle.net/DTcHh/#&togetherjs=hy7S1lFDR3

https://jsfiddle.net/DTcHh/ &togetherjs = hy7S1lFDR3

Hover Rows
The .table-hover class enables a hover state on table rows:
 



Firstname
Lastname
Email
Image




John
Doe
john@example.com



Mary
Moe
mary@example.com



July
Dooley
july@example.com

1 个解决方案

CSS
.mid-align:before {
  content: '';
  display: inline-block;
  height: 100%; 
  vertical-align: middle;
  margin-right: -0.25em;
    
 }

HTML


  
Hover Rows
  
The .table-hover class enables a hover state on table rows:
  

    

      

        
Firstname
        
Lastname
        
Email
        
Image
      
    
    

      

        
John
        
Doe
        
john@example.com
        

      
      

        
Mary
        
Moe
        
mary@example.com
        

      
      

        
July
        
Dooley
        
july@example.com