Question

我在基础揭示功能方面遇到了一个奇怪的问题。它不以我的页面为中心。

http://landpros.turnpostinteractive.com/LandPros_Results_2.html

如果您转到此页面并单击主要内容区域中显示“我的列表”的链接，它将显示模式，并且它显然不在页面的中心。无论浏览器大小如何，我都希望它能保持在屏幕的中心位置。

这可能吗？我可以克服css代码，但我很困惑，为什么默认情况下它不是那样的。

<p>  
  <a class="star" href="#"></a> add to <a class="link reveal" data-reveal-id="myModal" href="#">my listing</a><br/>
</p>

<div id="myModal" class="reveal-modal ModalCSS">
  <div class="modal-header">
    <h1>Add to My Listings</h1>
  </div><!--/modal-header-->
  <div class="modal-body">
    <p class="top">Please login to use our<br/> My Listings feature.</p><br/>
    <p>My Listings allows you to save your proper-<br/>ties for future visits. It is Free! </p>

    <br/><br/>
    <p class="right">
      <a href="#">login</a> | <a href="#">create an account</a>
  </div><!--/modal-body-->
  <a class="close-reveal-modal">&#215;</a>
</div>

这是我正在使用的HTML。

Answer 1

将Modal Box Css居中对齐： -

#myModal2 {
            top: 50%;
            left: 50%;
            margin: -202px 0px 0px -92px;
           }

基础JS模态中心

1 个答案: