フレックスコンテナの行間に何が生じる可能性がありますか？

Question

フレックスコンテナの行間に何かの原因がありますか？

私はdevプロジェクトへのリンクを削除しました。答えは自明ですが、最初の行の項目の1つが非常に高い高さに設定されていました。

は異なる内容で三div.pck（長い列を含む

*）div.hlang、div.headerstamp.stampcont、div.pckHeader、* svg#coatArmCyprus

）及び下段を含む上段）との間に大きなギャップがあります。

ギャップが発生する可能性はありますか？私はbody.contのこれらすべてのアイテムを整列させるので、フレックスコンテナはflex-direction: rowです。 justify-content: flex-start; align-content: flex-start; align-items: flex-start;

これらのすべての項目がbody.contに

body.cont { 
     box-sizing: border-box; 
     width: 100%; 
     position : relative; //normally nody is static 
     display: flex; /* container */ 
     flex-direction: row; 
     flex-wrap: wrap; /* nowrap | wrap | wrap-reverse; */ 
     justify-content: flex-start; /* main axia : flex-start | flex-end | center | space-between | space-around | space-evenly; */ 
     align-items: flex-start; /* cross axis: flex-start | flex-end | center | baseline | stretch; */ 
     align-content: flex-start; /* all c 
            ontainer lines : flex-start | flex-end | center | space-between | space-around | stretch; */ 
     margin:0; border:0; padding: 0 $bodyPadR 0 $bodyPadL; 
    } 



.pck { 
    box-sizing: border-box; 
    display: flex; /* container */ 
    flex-direction: column; 
    flex-wrap: wrap; /* nowrap | wrap | wrap-reverse; */ 
    justify-content: space-around; /* flex-start | flex-end | center | space-between | space-around | space-evenly; */ 
    align-items: flex-start; /* cross axis: flex-start | flex-end | center | baseline | stretch; */ 
    align-content: flex-start; /* all container lines : flex-start | flex-end | center | space-between | space-around | stretch; */ 
    border:0; margin:0; padding:0; 
    width:$colw; 
} 

Answer 1

をラップしているあなたは右のページをクリックし、選択した場合は点検」、先端として

---

div.hlangルールからheight: 30vw;を削除します"を選択すると、htmlを表示して、各アイテムがページ内でどのようにレンダリングされるかを確認できます。