# 一部が隠れる「.comment」を非表示にしたい

**URL:** <https://forum.onecomme.com/t/topic/758>\
**Category:** カスタマイズ\
**Created:** [2022 年 11 月 10 日午後 4:29 UTC](https://forum.onecomme.com/t/topic/758 "2022-11-10T16:29:02Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![hyk](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/hyk/32/75_2.png) [@hyk](https://forum.onecomme.com/u/hyk)\
**Post date:** [2022 年 11 月 10 日午後 4:29 UTC](https://forum.onecomme.com/t/topic/758/1 "2022-11-10T16:29:02Z")

</div>

これを↓

 ![ygvgfgvvghhgvhvg](https://canada1.discourse-cdn.com/flex031/uploads/onecomme/original/1X/dd8433b77d3c734f51330fc3cc81ba974e31ade7.webp)  
こんな↓感じに、  
 ![ygvgfgvvghhgvhvg](https://canada1.discourse-cdn.com/flex031/uploads/onecomme/original/1X/82d536f6bc36f63944bc39d2c122848ae3103c0b.webp)  
一部が表示されない（？）やつは全部表示されなくするようなカスタマイズをCSSのみで行うことは可能でしょうか。（高さと個数を固定する以外で）

---

<div class="post-metadata">

**Author:** ![sikozon](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/sikozon/32/77_2.png) [@sikozon](https://forum.onecomme.com/u/sikozon)\
**Post date:** [2022 年 11 月 11 日午前 1:17 UTC](https://forum.onecomme.com/t/topic/758/2 "2022-11-11T01:17:21Z")

</div>

考え方としましては  
・CSSで、コメントの表示数を２個（表示数は適宜）などに限定する。  
・CSSで、ボックスの並びを上揃えに変更する（デザイン上不要であれば下揃えのままで変更不要）  
・OBSで、テンプレート（ウィンドウ）の縦幅を十分にとる。  
といった感じで、やりたい感じの事は概ねできそうな気がします。

 ![image](https://canada1.discourse-cdn.com/flex031/uploads/onecomme/original/1X/672b0f3908410afc528a844a187a3286b53432ee.png)

```auto
.comment:nth-last-child(n+3) {
    display: none;
}
.comments{
  justify-content: flex-start; /* 配信レイアウト的に下揃えのままで良い場合は不要 */
  /* height:auto; 枠の高さを可変に（レイアウト的に必要であれば） */
}

```

* * *

以上、イメージとマッチしましたら幸いです👍

---

<div class="post-metadata">

**Author:** ![hyk](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/hyk/32/75_2.png) [@hyk](https://forum.onecomme.com/u/hyk)\
**Post date:** [2022 年 11 月 11 日午前 3:05 UTC](https://forum.onecomme.com/t/topic/758/3 "2022-11-11T03:05:25Z")

</div>

ありがとうございます！余白をおおめにとった上で個数を限定は思いつきませんでした。試したらまた報告します 🐔

---

<div class="post-metadata">

**Author:** ![hyk](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/hyk/32/75_2.png) [@hyk](https://forum.onecomme.com/u/hyk)\
**Post date:** [2022 年 11 月 11 日午後 7:00 UTC](https://forum.onecomme.com/t/topic/758/4 "2022-11-11T19:00:58Z")

</div>

いい感じになりました！ありがとうございました。

 ![image](https://canada1.discourse-cdn.com/flex031/uploads/onecomme/original/1X/cebabec6b909383cf7dd17caea96715bd9c5bff2.jpeg)  

 

```css
/*最終CSS*/
:root{
--lcv-background-color: tansplant;
/*--lcv-border-color: black;
--lcv-text-color: black;
--lcv-name-color: black;*/
}
.comments{
height: 100%;
}
.comment:nth-last-child(1) {
    max-height: 80%;
}
.comment:nth-last-child(2) {
    max-height: 20%;
}
.comment:nth-last-child(n+3) {
    display: none;
}
.comments{
  justify-content: flex-start;
}

```