的投资组合模式与填充左自动

的知识+我把这个模板的代码：Template Here 的投资组合模式与填充左自动

我使用的是引导一个portfolio-modal和它显示了以下错误：

当我打开，模态会自动出现+ padding-left:17px。我打开控制台，它显示：

element.style { 
display: block; 
padding-left: 17px; 
}

但是，此代码不存在。我不知道如何，但它是自动添加的。

有没有人遇到过这个问题？有谁知道如何解决这个错误/冲突？

.img-centered { 
 
    margin:0 auto 
 
} 
 

 

 
#portfolio .portfolio-item .portfolio-link .portfolio-hover { 
 
    background:#f05f40; 
 
    position:absolute; 
 
    width:100%; 
 
    height:100%; 
 
    opacity:0; 
 
    transition:all ease .5s; 
 
    -webkit-transition:all ease .5s; 
 
    -moz-transition:all ease .5s 
 
} 
 
#portfolio .portfolio-item .portfolio-link .portfolio-hover:hover { 
 
    opacity:1 
 
} 
 
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content { 
 
    position:absolute; 
 
    width:100%; 
 
    height:20px; 
 
    font-size:20px; 
 
    text-align:center; 
 
    top:50%; 
 
    margin-top:-12px; 
 
    color:#fff 
 
} 
 
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i { 
 
    margin-top:-12px 
 
} 
 
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3, #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 { 
 
    margin:0 
 
} 
 
#portfolio .portfolio-item .portfolio-caption { 
 
    max-width:400px; 
 
    margin:0 auto; 
 
    background-color:#fff; 
 
    text-align:center; 
 
    padding:25px 
 
} 
 
#portfolio .portfolio-item .portfolio-caption h4 { 
 
    text-transform:none; 
 
    margin:0 
 
} 
 
#portfolio .portfolio-item .portfolio-caption p { 
 
    font-family:"Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif; 
 
    font-style:italic; 
 
    font-size:16px; 
 
    margin:0 
 
} 
 

 
.portfolio-modal .modal-content { 
 
    border-radius:0; 
 
    background-clip:border-box; 
 
    -webkit-box-shadow:none; 
 
    box-shadow:none; 
 
    border:0; 
 
    min-height:100%; 
 
    width: 100%; 
 
    padding:100px 0; 
 
    text-align:center; 
 
} 
 
.portfolio-modal .modal-content h2 { 
 
    margin-bottom:15px; 
 
    font-size:3em 
 
} 
 
.portfolio-modal .modal-content p { 
 
    margin-bottom:30px 
 
} 
 
.portfolio-modal .modal-content p.item-intro { 
 
    margin:20px 0 30px; 
 
    font-family:"Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif; 
 
    font-style:italic; 
 
    font-size:16px 
 
} 
 
.portfolio-modal .modal-content ul.list-inline { 
 
    margin-bottom:30px; 
 
    margin-top:0 
 
} 
 
.portfolio-modal .modal-content img { 
 
    margin-bottom:30px 
 
} 
 
.portfolio-modal .close-modal { 
 
    position:absolute; 
 
    width:75px; 
 
    height:75px; 
 
    background-color:transparent; 
 
    bottom:25px; 
 
    right:25px; 
 
    cursor:pointer 
 
} 
 
.portfolio-modal .close-modal:hover { 
 
    opacity:.3 
 
} 
 
.portfolio-modal .close-modal .lr { 
 
    height:75px; 
 
    width:1px; 
 
    margin-left:35px; 
 
    background-color:#222; 
 
    transform:rotate(45deg); 
 
    -ms-transform:rotate(45deg); 
 
    -webkit-transform:rotate(45deg); 
 
    z-index:1051 
 
} 
 
.portfolio-modal .close-modal .lr .rl { 
 
    height:75px; 
 
    width:1px; 
 
    background-color:#222; 
 
    transform:rotate(90deg); 
 
    -ms-transform:rotate(90deg); 
 
    -webkit-transform:rotate(90deg); 
 
    z-index:1052 
 
} 
 
.portfolio-modal .modal-backdrop { 
 
    opacity:0; 
 
    display:none 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<section class="no-padding" id="portfolio"> 
 
     <div class="container-fluid"> 
 
      <div class="row no-gutter"> 
 
       
 
       <div class="col-lg-4 col-sm-6 portfolio-item"> 
 
        <a href="#portfolioModal1" class="portfolio-link" data-toggle="modal">      
 
         <div class="portfolio-hover"> 
 
          <div class="portfolio-hover-content">        
 
           <i class="fa fa-plus fa-3x"></i> 
 
          </div> 
 
         </div> 
 

 
         <img src="http://veja.abril.com.br/blog/radar-on-line/files/2015/04/modal.jpg" class="img-responsive" alt=""> 
 
         </a>  
 
       </div> 
 
       </div> 
 
      </div> 
 
      </section> 
 

 

 

 
<div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-hidden="true"> 
 
     <div class="modal-content"> 
 
      <div class="close-modal" data-dismiss="modal"> 
 
       <div class="lr"> 
 
        <div class="rl"> 
 
        </div> 
 
       </div> 
 
      </div> 
 
      <div class="container"> 
 
       <div class="row"> 
 
        <div class="col-lg-8 col-lg-offset-2"> 
 
         <div class="modal-body"> 
 
          
 
          <h2>Project Name</h2> 
 
          <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p> 
 
          <img class="img-responsive img-centered" src="img/portfolio/roundicons-free.png" alt=""> 
 
          
 
          <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia exsit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repu. Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia exsit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repuUse this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia exsit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum,Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repu</p> 
 
          
 
          <strong>Want these icons in this portfolio item sample?</strong>You can download 60 of them for free, courtesy of <a href="https://getdpd.com/cart/hoplink/18076?referrer=bvbo4kax5k8ogc">RoundIcons.com</a>, or you can purchase the 1500 icon set <a href="https://getdpd.com/cart/hoplink/18076?referrer=bvbo4kax5k8ogc">here</a>.</p> 
 
          <ul class="list-inline"> 
 
           <li>Date: July 2014</li> 
 
           <li>Client: Round Icons</li> 
 
           <li>Category: Graphic Design</li> 
 
          </ul> 
 
          <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> Close Project</button> 
 
         </div> 
 
        </div> 
 
       </div> 
 
      </div> 
 
     </div> 
 
    </div>

来源

2016-02-26 Zkk

您是否尝试过使用CSS？我假设CSS来自引导CSS源之一链接---// element.style {display：block; block; padding-left：0px！important; } – Alex

听起来像它在JavaScript添加。

这将是元素的内嵌样式，例如

<body style="display:block; padding-left:17px;">

您应该能够打开开发者工具，以及按Ctrl + F/CMD + F来搜索知识+和找到它。

他们可能会添加它来尝试和抵消页面在触发没有添加滚动条时弹出的任何跳转。

一种简单的方法来解决它会覆盖风格

.offending__element{ 
    padding-left:0px !important; 
}

这不是解决它的最好办法，但我们可以用你提供什么提供了唯一的解决方案。

来源

2016-02-26 14:15:57 Callam

的投资组合模式与填充左自动

回答

相关问题