2016-08-21 72 views
0

卡盒我尝试创建一个引导卡+ animate.css创建Twitter的引导和animate.css

请与谷歌chorme检查最新版本:

<div class="shop-card well"> 
     <h3><a href="/">title 1</a></h3> 
     <a href="/"> 
      <figure class="figure"> 
       <img class="figure-img img-fluid img-rounded" src="http://wewswiderska.home.pl/images/3dspace.html-i1.png"> 
      </figure></a> 

      <div class="price">1234 <span class="symbol">R</span> 
       <del>5678</del> 
      </div> 

      <form class="hide buys" id="inform-ordering-5" name="inform-ordering-5" role="form" style="overflow: hidden;position: absolute;left:-1px;width: 100%; bottom: -1px;"> 
       <div class="btn-group btn-group-justified"> 
        <a class="btn btn-danger" data-target="#phoneModal" data-toggle="modal" href="#">modal</a> 
       </div> 
      </form> 
    </div> 

我希望当我将鼠标移到卡上,出现一个红色按钮。然后消失。

我做到了。

现在当我点击按钮时,它会打开一个模式框。

我做到了!

但是,这是我的问题:

当我关闭模式对话框,卡contaners漂浮到左!

这里是一个演示:https://jsfiddle.net/1pyeg7w2/

我不就解决了。

回答

0

我包你div.shop-card.well内容与另一分度position:relative规则,它似乎是工作

<div class="shop-card well"> 
    <div style="position:relative"> 
     your content here 
    </div> 
</div>