퍼블? 질문 좀 드립니다. 채택완료

이렇게 최신글을 만들고 있는데 문제가 생겼습니다.
제가 원하는 건 하단의 이미지 처럼 '애국가 1절'과 '애국가 2절'이 같은 라인에 수평하게 있는 겁니다.
하지만 상단 처럼 '애국가 1절'이 위로 달라 붙네요 ㅠㅜ
제가 잼병이라 막막합니다.
text001-동해물과 백두산이
애국가 1절입니다.
이런 구조로 되어 있습니다.
큰 ul에 flex를 사용해서 만들었습니다.
머리 속에는 작은 ul을 bottom 정렬 하면 될 거 같은데 아무리 구글링을 해도 못 찾겠네요 ㅜㅠ
도움 좀 부탁드립니다.
답변 3개
저라면 div에 flex를 column으로 줘서 justify-content: space-between 줄 것 같아요
대신 span의 컨텐츠에 따라 높이가 달라질 수 있으니 div 높이도 고정이어야할거고..
span에 일정 길이 이상이 되면 ellipsis 처리 정도 할 듯합니다
댓글을 작성하려면 로그인이 필요합니다.
이건 해결하시려면 스크립트넣어서 하셔야될텐데 굉장히 비추천드립니다
제목이 두줄이 될지 세줄이 될지 모르는 상황에서 높이값을 주면
한줄일 경우 너무 붕 뜨게되죠
스크립트넣어서 해결하실거면 각 요소마다 반복문으로 높이값을 구해서
모든 요소에 같은 높이값을 주도록 해주셔야됩니다
댓글을 작성하려면 로그인이 필요합니다.
답변에 대한 댓글 2개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
하지만 span은 inline 형식이라 높이나 넓이 지정이 안됩니다 ㅜㅠ