HTML and CSS
<!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">
<title>회원가입</title>
<style>
h3{
font-size:12px;
}
body{
background: #efefef;
}
input{
border:none;
}
.ps_box{
display: block;
height: 26px;
width: 260px;
padding: 7px 14px;
background: #fff;
border: 1px solid #ddd;
}
.setup_url{
font-size:11px;
color:#666;
}
</style>
</head>
<body>
<div class="row_group">
<div class="join_now">
<h3 class="join_class">
아이디
</h3>
<span class="ps_box int_id">
<input type= "text" class="int">
<span class="setup_url">@naver.com</span>
</span>
</div>
</div>
</body>
</html>
RESULT
처음에는 .setup_url이 확장하고 축소할때 움직였다
setup_url이 ps_box 안에 들어가 있어서 ps_box의 width가 좁으니까 setup_url이 튀어나온거였다.
width를 맞게 줄여주니 해결됨
'Code' 카테고리의 다른 글
2021.3.16 (0) | 2021.03.16 |
---|---|
3.15 (0) | 2021.03.15 |
2021.3.12(Thu) - Practice (0) | 2021.03.12 |
2021.3.11(Thu) - Group Assignment (0) | 2021.03.11 |
2021.3.10 (Wed) - container/ contents (0) | 2021.03.10 |