버튼 위치 조절... | 스파르타 커뮤니티

커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
버튼 위치 조절...
undefined주차
윤*진
・
추천
・
조회수
답변 완료
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <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>

    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100&display=swap" rel="stylesheet">

    <title>선착순 공동구매</title>

    <style>
        * {
           font-family: 'Noto Sans KR', sans-serif;
            color: white;
        }

        body {
            background-color: skyblue;
            background-position: center;
            background-size: cover;
        }

        h1 {
            font-weight: bold;
            text-align: center;
        }
        h3 {
            text-align: center;
        }

        .order {
            background-position: center;
            background-size: cover;
            width: 500px;
            margin: 60px auto 0px auto;
            padding-top: 10px auto;
        }
        .order > table {
            margin: 40px 0;
            font-size: 18px;
            background-position: center;
        }

        option {
            color: black;
        }
         .buttonn {

             background-color: #1d3557;
             background-position: center;
             width: 100px;
             border: none;

             position : center;


         }
    </style>
    <script>
        $(document).ready(function () {
            show_order();
        });

        function show_order() {
            $.ajax({
                type: 'GET',
                url: '/mars',
                data: {},
                success: function (response) {
                    alert(response['msg'])
                }
            });
        }

        function save_order() {
            let name = $('#name').val()
            let address = $('#address').val()
            let size = $('#size').val()


            $.ajax({
                type: 'POST',
                url: '/mars',
                data: { name_give: name, address_give: address, size_give: size},
                success: function (response) {
                    alert(response['msg'])
                    window.location.reload()
                }
            });
        }
    </script>
</head>
<body>
<div class="mask"></div>
<div class="order">
    <h1>모 운 다 모</h1>
    <div class="order-info">
        <div class="input-group mb-3">
        <div class="input-group mb-3">
            </select>
        </div>
    </div>
    <table class="table">
        <thead>
        <tr>
            <th scope="col">맞춤운동</th>
            <th scope="col">장소추천</th>
            <th scope="col">커뮤니티</th>
        </tr>
        </thead>
    </table>
</div>
    <div class="input-group mb-3">
        <label class="input-group-text" for="inputGroupSelect01">운동경력</label>
        <select class="form-select" id="inputGroupSelect01">
            <option selected>-- 선택하기 --</option>
            <option value="1">초급자(6개월미만)</option>
            <option value="2">중급자(머신 및 프리웨이트 혼자가능)</option>
            <option value="3">숙련자(운동프로그램 계획 가능)</option>

        </select>
    </div>
    <div class="input-group mb-3">
        <label class="input-group-text" for="inputGroupSelect01">주운동횟수</label>
        <select class="form-select" id="inputGroupSelect01">
            <option selected>-- 선택하기 --</option>
            <option value="1">주/1일</option>
            <option value="2">주/2일</option>
            <option value="3">주/3일</option>
            <option value="4">주/4일</option>
            <option value="5">주/5일 (5일 이상)</option>
        </select>
    </div>
     <div class="input-group mb-3">
        <label class="input-group-text" for="inputGroupSelect01">일일 운동시간</label>
        <select class="form-select" id="inputGroupSelect01">
            <option selected>-- 선택하기 --</option>
            <option value="1">30분-1시간</option>
            <option value="2">1시간-1시간30분</option>
            <option value="3">1시간-2시간</option>
            <option value="4">2시간 이상</option>
            <option value="5">시간 상관없음</option>
        </select>
    </div>
     <div class="input-group mb-3">
        <label class="input-group-text" for="inputGroupSelect01">운동부위</label>
        <select class="form-select" id="inputGroupSelect01">
            <option selected>-- 선택하기 --</option>
            <option value="1">가슴</option>
            <option value="2">등</option>
            <option value="3">팔</option>
            <option value="4">허벅지</option>
            <option value="5">종아리</option>
            <option value="6">복근</option>
            <option value="7">다이어트</option>
            <option value="8">유산소</option>
        </select>
    </div>
    <div class="mybtns">
        <button class="buttonn"> 기록하기</button>
    </div>
</body>
</html>
연습중인데, 버튼 위치가 바뀌질 않네요 ...ㅠㅠㅠ
background-position: center;
position: center;
position: relative;
세가지 해봐도 되질않네요 ㅠㅠㅠ
댓글 알림