2 글 보임 - 1 에서 2 까지 (총 2 중에서)
-
지금 가장 아래 체크박스가 가로줄 한줄을 전부 차지하고 있어서, 누르기/구매하기와 한 라인에 위치가 되지 않습니다. 어떻게 수정하면 될까요? 감사합니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="main.css" rel="stylesheet">
</head>
<body>
<div class="background">
<div class="main-background">
<div class="first-form">
<h2 class="contact">contact us</h2>
<p>Your Email</p>
<form>
<input type="email" placeholder="email@example.com">
</form>
</div>
<div class="second-form">
<div class="left-form">
<p>First name</p>
<form>
<input type="text">
</form>
</div>
<div class="right-form">
<p>First name</p>
<form>
<input type="text">
</form>
</div>
</div>
<div style="clear:both;"></div>
<div class="third-form">
<p>Message</p>
<form>
<textarea rows='10' style="width:100%; box-sizing:border-box"></textarea>
</form>
</div>
<div class="bottom-form">
<input type="checkbox">
<label for="subscribe">누르기</label>
<button>구매하기</button>
</div>
</div>
</div>
</body>
</html>
body{ margin:0; }div{ margin:0; box-sizing: border-box; }.background{ width:800px; height:1000px; background-color: #eee; display:flex; align-items:center; }.contact{ margin:0; padding-top:5%; padding-bottom:5%; font-family: 'gulim'; font-size:2vw; }.main-background{ background-color: aqua; width:75%; height:90%; margin:auto; align-items:center; }input{ width:100%; padding:15px; box-sizing:border-box ;} .left-form{ float:left; width: 40%; }.right-form{ float:right; width : 40%; }.main-background div{ margin-top: 2vw; }.third-form{ padding-top: 3vw; }.bottom-form{ background-color: aquamarine; width:100%; }
2 글 보임 - 1 에서 2 까지 (총 2 중에서)
- 답변은 로그인 후 가능합니다.