Şu CSS Düzenlemesini Nasıl Stabil Hale Getirebilirim? Yüksekliğe Göre Uzaması Gerekiyor?

Sorun çözüldü, farklı bir yaklaşım ile @KadirKC; hocam halletti.

Yorum alanı için ağaç gibi :before :after kullanarak çizgiler ekledim ancak yoruma gelen cevaba gelen cevap söz konusu olunca sıkıntı çıkıyor? Yorumun içeriği uzayınca çizginin de uzaması gerek ama sabit ya da %'li yükseklik vermek sorunu çözmüyor: https://prnt.sc/12uwg5c Bu konuda ne yapabilirim acaba?

Deneme yorumlarının olduğu canlı sayfa şu: https://sistemgereksinimleri.net/sni...omment-page-1/

%100 verince böyle oluyor: https://prnt.sc/12uwjef
Olması gereken: https://prnt.sc/12uwkmt

Biraz karışık bir konu, forumda bunu çözecek biri çıkar mı emin değilim :/ Konuyu açarken pek ümidim yoktu ama bakalım..

Hocam biraz baktım da direkt olarak yükseklik vermek olmaz kanımca. Yorumların satırlarına göre aşağıya doğru inmesi lazım sanırım. Direkt örnek 150 height verirsek kısa yorum olunca aşağı sarkmış gözükür. Benim için biraz karışık ama uzman arkadaşlar bir çözüm yaratır sanırım.

https://prnt.sc/12uxd3o

https://prnt.sc/12uxcv0

Valla hocam bende bu yüzden yüksekliği %100 verip alttaki yoruma göre kısaltayım dedim "calc(100% - 60px);" şeklinde bu sefer de alttaki yorum uzun olunca sıkıntı çıktı.

Aslında üst yorumun yüksekliği işini görür. Onun için üst yorumun içerisinde before yapıp 100% yapıyorsun. Basit anlatımı ile bu şekilde aslında. Codepen üzerinden falan sadece o alanın kodları atsanız belki çözümü daha kolay olur.

https://prnt.sc/12uxv8b

https://prnt.sc/12uxx2r

Bunun üzerinden gidip bazı bugları temizledikten sonra istediğin hali alacaktır. Bu şekilde ikinci görselde göründüğü üzere bug var.

Hocam ben nerede yanlış yapıyorum anlamadım, hala yapamadım ya. 1 .görseldeki gibi bir türlü olmuyor bende? .children .children:before yerine .children .comment-area:before yapmam gerekmiyor mu? Sonuç böyle: https://prnt.sc/12uzw1a

basit olarak bu güncellemeyi yaparsın bir adım ilerler. https://prnt.sc/12v08tb