İlk öğe bir flexbox sargısında nasıl hariç tutulur?

Question

İlk öğeyi işaretlemeyi yeniden düzenlemek dışında bir esnek sargı içinde çıkarmanın bir yolu var mı?

<div class="container">  
    <div id="tobeexcluded">abc</div> 
    <div class="flexitem">content</div> 
    <div class="flexitem">content</div> 
    <div class="flexitem">content</div> 
</div> 

DÜZENLEME: Şimdi

:not(:first-child) 

ve ayrıca

:not(#tobeexcluded) 

denedim ama işe yaramıyor. Bu da drupal manzara, gerçek sınıf inşaat:

.view-id-reference_list .view-content:not(:first-child) { 
display: flex 
flex-flow: wrap 
} 

Fiddle: https://jsfiddle.net/Lxhpwqzn/1/ ama işaretlemeyi değiştirmeden: https://jsfiddle.net/m62090za/4/

İşte ben istiyorum.

Answer 1

İlk öğeyi işaretlemeyi yeniden düzenlemek dışında bir esnek sargı içinde çıkarmanın bir yolu var mı?

şimdi içerik ilk div sonra sarmak için aslında ne gereklidir olduğunu anlıyoruz bazı ilk karışıklık sonra.

Açıkçası, bunu başarmanın en basit yolu, ilk div için ebeveynin% 100 genişliğidir.

.view-container .view-content { 
 
    display: flex; 
 
    flex-wrap: wrap; 
 
    justify-content: space-between; 
 
} 
 
.filterbox { 
 
    flex: 0 0 100%; 
 
}

<div class="view-container"> 
 
    <div class="view-content"> 
 
    <div class="filterbox">FILTER</div> 
 
    <div class="flex-item"> 
 
     Flex-ITEM 
 
    </div> 
 
    <div class="flex-item"> 
 
     Flex-ITEM 
 
    </div> 
 
    <div class="flex-item"> 
 
     Flex-ITEM 
 
    </div> 
 
    </div> 
 
</div>