강의

멘토링

로드맵

Inflearn brand logo image

인프런 커뮤니티 질문&답변

Welldone님의 프로필 이미지
Welldone

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

이미지 구현하기

verticalAlign이 제대로 안먹어서 "N개의 사진 더보기" 의 위치가 이상하게 나올경우.

작성

·

218

·

수정됨

0

      <>
            <div>
                // img 태그의 스타일에도 버티컬얼라인 미들 추가해주면 정상적으로 나옵니다. 
                <img role="presentation" style={{ verticalAlign: 'middle' }} width="50%" src = {images[0].src} alt={images[0].src} onClick={onZoom} />
                <div
                    role="presentation"
                    style={{ display: 'inline-block', width: '50%', textAlign: 'center', verticalAlign: 'middle' }}
                    onClick={onZoom}
                >
                    <PlusOutlined />
                    <br />
                    {images.length - 1 }개의 사진 더보기
                </div>
            </div>
        </>

사용 환경 Antd 5

답변 1

1

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

요즘은 display: flex 로 간편하게 하시는 거 추천드립니다~

Welldone님의 프로필 이미지
Welldone
질문자

그러고 보니 그리드 플렉스로 해도 되는거였군요 ㅎㅎ

Welldone님의 프로필 이미지
Welldone

작성한 질문수

질문하기