调整模式条款和条件答案

【问题标题】：Adjusting Modal Terms and Conditions调整模式条款和条件
【发布时间】：2018-10-31 13:56:54
【问题描述】：

美好的一天，只是问我如何将我的条款和条件中的文本置于模式弹出窗口的中心。添加模态 css 以尝试居中它似乎不起作用。感谢任何可以提供帮助的人。

HTML：

<div class="modal fade" id = "myModal" tabindex = "-1" role = "dialog" aria-labelledby = "myModalLabel" aria-hidden = "true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <div class="container spacer text-align-justify">
            <div class="row">
              <div class="col-md-12 col-xs-12 spacer"><br><br></div> <!--spacer-->

              <div class="col-md-12" style="width: 700px;">
                <div class="col-md-12 text-align-center">
                  <h2 class="bold_font">GENERAL TERMS AND CONDITIONS</h2>
                  <br><br><br><br>
                </div>..................................................

.......................条款和条件内容

CSS：

.modal {
   width: 300px;
   height: 300px;
   position: absolute;
   left: 50%;
   top: 50%;
   margin-left: -150px;
   margin-top: -150px;
}

screenshot

【问题讨论】：

标签： html css twitter-bootstrap bootstrap-modal

【解决方案1】：

您可以在模态框类中添加变换：translate(-50%, -50%); with left: 50%; top:50%;

.modal {
        width: 300px;
        height: 300px;
        top:50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 10px;
        position: absolute;
       }

【讨论】：

【解决方案2】：

你的 CSS，

.modal {
        width: 300px;
        height: 300px;
        margin-top: 100px; #add according to your requirement
        margin-left: auto;
        margin-right: auto;
        padding: 10px; # add if you want
       }

【讨论】：