다시 질문드려봅니다... ㅠㅠ | 스파르타 커뮤니티

커뮤니티

포인트

쿠폰

내 강의실

국비 신청 내역

증명서

계정

로그아웃

학습 질문

개발 일지

나의 활동

답변 완료

다시 질문드려봅니다... ㅠㅠ

undefined주차

이*경

・

추천

・

조회수

답변 완료

답변에 감사드립니다..

그런데 제가 주신 답변설명을 이해를 하는데 여전히 어려움이 있어... ㅠㅠ

말씀을 주신 부분처럼 코드를 변경해 보아도 여전히 카드 부분의 마진 적용이 안되고 있는데 가능하다면 코드를 변경한 모습을 확인 요청드리거나 보다 상세하게 설명 부탁을 드릴 수가 있을까요? ㅠㅠㅠ 감사합니다....

제가 변경을 또 해보아도 그대로 입니다...

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
          integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
            crossorigin="anonymous"></script>

    <title>스파르타코딩클럽 | 부트스트랩 연습하기</title>
    <link href="https://fonts.googleapis.com/css2?family=Gowun+Dodum&display=swap" rel="stylesheet">
    <Style>
        * {
            font-family: 'Gowun Dodum', sans-serif;
        }

        .mytitle {
            width: 100%;
            height: 250px;

            color: white;

            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;

            background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("https://cdn.mos.cms.futurecdn.net/X2HayNRX94wPEBtGqg7MJE-1024-80.jpg.webp");
            background-position: center 20%;
            background-size: cover;
        }

        .mypost {
            box-shadow: 0px 0px 3px 0px gray;
            max-width: 500px;
            width: 95%;

            padding: 20px;
            margin: 20px auto;
        }

        .mypost > button {
            margin-top: 20px;
        }

        .mycard {
            max-width: 500px;
            width: 95%;
            margin: 20px auto;

        .card {
            margin-top: 20px;
        }
    </Style>
</head>

<body>
<div class=mytitle>
    <h1>타이타닉(The Titanic) 팬명록</h1>
</div>
<div class="mypost">
    <div class="form-floating mb-3">
        <input type="email" class="form-control" id="floatingInput" placeholder="name@example.com">
        <label for="floatingInput">닉네임</label>
    </div>
    <div class="form-floating">
        <textarea class="form-control" placeholder="Leave a comment here" id="floatingTextarea2"
                  style="height: 100px"></textarea>
        <label for="floatingTextarea2">응원댓글</label>
    </div>
    <button type="button" class="btn btn-dark">응원 남기기</button>
</div>
    <div class="mycard">
    <div class="card">
        <div class="card-body">
            <blockquote class="blockquote mb-0">
                <p>새로운 영화 너무 멋져요!</p>
                <footer class="blockquote-footer">호빵맨</footer>
            </blockquote>
        </div>
    </div>
    <div class="card">
        <div class="card-body">
            <blockquote class="blockquote mb-0">
                <p>새로운 영화 너무 멋져요!</p>
                <footer class="blockquote-footer">호빵맨</footer>
            </blockquote>
        </div>
    </div>
    <div class="card">
        <div class="card-body">
            <blockquote class="blockquote mb-0">
                <p>새로운 영화 너무 멋져요!</p>
                <footer class="blockquote-footer">호빵맨</footer>
            </blockquote>
        </div>
    </div>
</div>
</body>

</html>

댓글 알림