Question

我是编程的新手，并尝试使用flex构建一个包含CSS / HTML的页面。我制作了一个由3个div组成的小组，可以在页面上展示各种广告。到目前为止我只完成了一个，但是在使用chrome进行测试时似乎没有用。我也在firefox中进行了测试，看起来工作正常。我尝试过clearfixes无济于事。

SCSS：

  main{
    width:80%;
    margin: calculateRem(30pt) auto;

    &>*{
      width:100%;
    }

    #featured_ad_panel{
      display:flex;
      flex-direction: row;
      margin-top: calculateRem(30pt);

      &>figure{
        flex-grow: 1;

        #ad_container{
          height:270px;
          width: 217px;
          border: calculateRem(1pt) solid $color-4;
          margin: auto;

        }

      }
    }
  }

HTML

<main>
   <section id="featured_ads">
      <h1>Featured Deals</h1>
      <section id="featured_ad_panel">
         <figure id="ad1">
            <div id="ad_container">
               <img src="http://via.placeholder.com/217x270" alt="Phone Image">
            </div>
         </figure>
         <figure id="ad2">Ad 2</figure>
         <figure id="ad3">Ad 3</figure>
      </section>
   </section>
   Scss:
   <section id="bargains"></section>
</main>

注意 calculateRem函数是我用来从点获取Rem大小的简单函数。

Answer 1

这是很久以前的问题，但可能对您有所帮助。尝试在Chrome中关闭您的广告拦截器或将ID更改为“更少广告”（根据另一个问题的答案）

其他stackoverflow问题：DIV not showing up in Chrome

Div没有在Google Chrome中显示（在firefox中显示）

1 个答案: