：第n個孩子不工作

Question

這是一個WordPress插件對Ajax載入站的HTML

<div class="row newsrow"> 
    <div> 
    <div id="ajax-load-more" class="ajax-load-more-wrap alm-0" data-alm-id="0" data-canonical-url="http://bayron.nl/" data-slug="home"> 
     <ul class="alm-listing alm-ajax " data-repeater="default" data-post-type="post" data-post-format="" data-category="" data-category-not-in="" data-tag="" data-tag-not-in="" data-taxonomy="" data-taxonomy-terms="" data-taxonomy-operator="" data-taxonomy-relation="" 
     data-meta-key="" data-meta-value="" data-meta-compare="" data-meta-relation="" data-meta-type="" data-year="" data-month="" data-day="" data-author="" data-post-in="" data-post-not-in="" data-exclude="" data-search="" data-custom-args="" data-post-status="" 
     data-order="DESC" data-orderby="date" data-offset="0" data-posts-per-page="3" data-lang="" data-scroll="false" data-scroll-distance="150" data-max-pages="0" data-pause-override="false" data-pause="false" data-button-label="Older Posts" data-button-class="" 
     data-destroy-after="" data-transition="fade" data-images-loaded="true"> 
     <div class="alm-reveal"> 
      <li> 
      <div class="list-content"> 
       <img width="360" height="240" src="http://bayron.nl/wp-content/uploads/2017/01/helsinki.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" srcset="http://bayron.nl/wp-content/uploads/2017/01/helsinki.jpg 360w, http://bayron.nl/wp-content/uploads/2017/01/helsinki-300x200.jpg 300w" 
       sizes="(max-width: 360px) 100vw, 360px"> 
       <h3><a href="http://bayron.nl/2017/01/27/future-digital-finance-forum/" title="FUTURE DIGITAL FINANCE FORUM">FUTURE DIGITAL FINANCE FORUM</a></h3> 
       <p>April 2017 | Helsinki | Keynote Speaker</p> 
       <p>Future Digital Finance Forum gathers the pioneers and decision makers to discuss the opportunities and challenges caused by digitalization and disruption in the industry.</p> 
      </div> 
      </li> 
      <li> 
      <div class="list-content"> 
       <img width="384" height="240" src="http://bayron.nl/wp-content/uploads/2017/01/wroclaw.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" srcset="http://bayron.nl/wp-content/uploads/2017/01/wroclaw.jpg 384w, http://bayron.nl/wp-content/uploads/2017/01/wroclaw-300x188.jpg 300w" 
       sizes="(max-width: 384px) 100vw, 384px"> 
       <h3><a href="http://bayron.nl/2017/01/27/impactcee-2016-fintechinsurtech/" title="IMPACTCEE 2016 FINTECH/INSURTECH">IMPACTCEE 2016 FINTECH/INSURTECH</a></h3> 
       <p>December 2016 | Wroclaw | Keynote Speaker</p> 
       <p>This is the most content driven fintech congress in the Central Eastern Europe gathering the top industry innovators.</p> 
      </div> 
      </li> 
      <li> 
      <div class="list-content"> 
       <img width="360" height="191" src="http://bayron.nl/wp-content/uploads/2017/01/classof17.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" srcset="http://bayron.nl/wp-content/uploads/2017/01/classof17.jpg 360w, http://bayron.nl/wp-content/uploads/2017/01/classof17-300x159.jpg 300w" 
       sizes="(max-width: 360px) 100vw, 360px"> 
       <h3><a href="http://bayron.nl/2017/01/27/meet-the-11-startup-teams-from-our-fintech-cybersecurity-2017-class/" title="MEET THE 11 STARTUP TEAMS FROM OUR FINTECH &amp; CYBERSECURITY 2017 CLASS!">MEET THE 11 STARTUP TEAMS FROM OUR FINTECH &amp; CYBERSECURITY 2017 CLASS!</a></h3> 
       <p>November 2016 | Startup Bootcamp</p> 
       <p>On the 22-23 of November, Selection Days for our FinTech &amp; CyberSecurity program took place. The event was very special: not only it was selecting the first cohort for our recently announced FinTech &amp; CyberSecurity program but also 
       celebrating the 100th startup selected for the programs in Amsterdam.<br> The event truly was a celebration of entrepreneurship, empowerment, ecosystem and innovation. <a href="https://youtu.be/uPsCgRjL6bc" target="_blank">Watch the aftermovie to feel the energy.</a></p> 
       <p>&nbsp;</p> 
      </div> 
      </li> 
     </div> 
     </ul> 
     <div class="alm-btn-wrap"><button id="load-more" class="alm-load-more-btn more">Older Posts</button></div> 
    </div> 
    </div> 
</div> 

這是很多，但我想告訴它，因爲我不知道到底是哪裏的問題。我將嘗試解釋我在HTML中使用的類別在哪裏，這些是我在項目中使用的唯一的第2個孩子，它們不起作用。

.alm-listing > li:nth-child(4) { 
    padding: 0 10px; 
    margin-top: 5% 
} 

.alm-listing > li:nth-child(3) { 
    position: absolute; 
    top: 20%; 
    left: 0; 
    right: 0; 
    color: #fff 
} 

.alm-listing的類從第4個HTML元素開始;無序列表 然後css應該選擇該UL中的列表元素。在這些列表元素中，第三和第四個元素（兩個不同的段落）應該由第n個孩子選中。不要擔心列表內容類的div，我試着把它拿出來，但是CSS仍然不行。

如果有人能幫助我，我將非常感激！

Answer 1

我覺得你的問題是你想的風格<li>直接內<ul>因爲這是該alm-listing > li做的，但你有另一個div中的<li>標籤。

試試這個

.alm-listing > div > li:nth-child(4) { 
    padding: 0 10px; 
    margin-top: 5% 
} 

.alm-listing > div > li:nth-child(3) { 
    position: absolute; 
    top: 20%; 
    left: 0; 
    right: 0; 
    color: #fff 
} 

Answer 2

右，所以我想我找到了問題。這不是CSS。我將我的CSS進行了非個性化處理，以便我可以更輕鬆地排列一些媒體查詢。解除問題後，問題開始了。我從2天前發現了我的CSS備份（縮小）。當我將縮小版本上傳到我的網站時，第n個孩子就像他們應該那樣工作。我將minified備份unminified並上傳到我的網站，瞧，我的代碼停止工作......我不能相信這是甚至是一件事。對於有人想知道我以前用什麼網站來取消預訂，在這裏他們是; unminify.com和codepen.com的編輯器（tidy CSS）。

韋爾普我想我必須重新開始;/