div질문이요~ 정보
div질문이요~
본문
#swleft img {
width: 80px;
height: 170px;
position: absolute;
top:0;
left:0;
z-index:12;
}
#swright img {
width: 80px;
height: 170px;
position: absolute;
top:50%;
right:0;
z-index:12;
}
</style>
이렇게 스타일은 줬는데요~
지금위 코드론 맨위에 붙어있어서..
top부분을...
px,%로 조절해보니
디바이스 크기에따라
첨부파일처럼 위치가 변하는데 어떻해야할까요/>ㅠㅠㅠ
제가원하는건 맨위그림처럼
가운데 양끝에 위치해있는겁니다.
어느 크기의 디바이스라도..
질문해결이 안되다시 올립니다.
가로로 늘리게 되면 이동됩니다.
세로로 이동했을땐 상관없는데..
댓글 전체
화살표 이미지의 높이값 예를 들어 세로20px의 이미지라면 절반 만큼 margin-top:-10px를 넣어주시면 위치를 맞추실 수 있겠네요.
<div style="position:relative;height:200px;width:300px;background:#777;">
<div style="position: absolute;left:5px;top:50%;margin-top:-10px;width:30px;height:20px;background:#fff;"></div>
<div style="position: absolute;right:5px;top:50%;margin-top:-10px;width:30px;height:20px;background:#fff;"></div>
</div>
이런식으로
<div style="position:relative;height:200px;width:300px;background:#777;">
<div style="position: absolute;left:5px;top:50%;margin-top:-10px;width:30px;height:20px;background:#fff;"></div>
<div style="position: absolute;right:5px;top:50%;margin-top:-10px;width:30px;height:20px;background:#fff;"></div>
</div>
이런식으로