* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.

* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.

div class="my_posting_box" 자체의 높이를 줄이고 안의 컨텐츠들도 안정적으로 담기게 하고 싶은데요. style시트에 height를 500px을 줬더니 박스 겉면의 높이만 조절되고 안의 컨텐츠들은 그대로 이네요 해결방법을 알고싶어요. 그리고 <label for="floatingInput">앨범날짜</label> 에서 앨범날짜를 앨범 제목 으로 글자만 바꾸면 웹페이지에 원하는데로 표시되는데 굳이<input type="email" class="form-control" id="floatingInput" placeholder="앨범이미지"> 에서 placeholder="앨범이미지" 부분까지 수정하는 이유가 뭔지 궁금합니다. placeholder의 역할은 무엇인가요?

작성한 코드 및 에러 메세지

오류 발생 시, 작성한 코드 전체와 에러 메시지를 첨부해 주세요.

Tip 1) </> 아이콘을 눌러 코드박스를 만들어 보세요.

.my_posting_box{

            width: 500px;

            height: 500px;

            margin: 30px auto 0px auto;

            padding: 20px;

            box-shadow: 0px 0px 3px 0px blue;

            border-radius: 5px;

        }

<div class="my_posting_box">

        <div class="form-floating mb-3">

            <input type="email" class="form-control" id="floatingInput" placeholder="앨범이미지">

            <label for="floatingInput">앨범이미지</label>

        </div>

        <div class="form-floating mb-3">

            <input type="email" class="form-control" id="floatingInput" placeholder="앨범제목">

            <label for="floatingInput">앨범제목</label>

        </div>

        <div class="form-floating mb-3">

            <input type="email" class="form-control" id="floatingInput" placeholder="앨범내용">

            <label for="floatingInput">앨범내용</label>

        </div>

        <div class="form-floating mb-3">

            <input type="email" class="form-control" id="floatingInput" placeholder="앨범날짜">

            <label for="floatingInput">앨범날짜</label>

        </div>

        <div class="my_btn">

            <button type="button" class="btn btn-dark">Dark</button>

            <button type="button" class="btn btn-outline-dark">Dark</button>

        </div>

    </div>

Tip 2) Ctrl+A(맥의 경우 Command+A) 단축키로 코드를 한 번에 선택할 수 있어요!