文本移动引导按钮

Question

引导按钮有一些文字，当我运行按钮之外的按钮上的文字移动，但按钮是固定大小 如何使按钮响应

.div{ 
 
     float:left; 
 
     height:300px; 
 
     width:22%; 
 
     margin-top:15px; 
 
     margin-left:15px; 
 
     background-color: #e4f2ff; 
 
     position: relative; 
 
    } 
 
    .div img{ 
 
     width:100%; 
 
     height:180px; 
 
    } 
 
    .div h1{ 
 
     font: 500 1.5em Roboto,Arial,Helvetica !important; 
 
    } 
 
    .div div{ 
 
     position: absolute; 
 
     bottom:0; 
 
     width:100% 
 
    } 
 
    .div div a{ 
 
     width:50px; 
 
      }

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="div"> 
 
       <img src="dual.png"/> 
 
       <h1>Boot From a CD or USB Drive on Any PC</h1> 
 
       <div><a href="#" class="btn btn-xs btn-success">Default text here</a></div> 
 
      </div>

能有人帮我

Answer 1

添加到您的CSS：

.div div .btn-success { 
      width: 100%; 
     } 

http://jsfiddle.net/owL9c1gt/1/