게시판 즐겨찾기
편집
드래그 앤 드롭으로
즐겨찾기 아이콘 위치 수정이 가능합니다.
css 고정너비값 주기.
게시물ID : programmer_18661짧은주소 복사하기
작성자 : JORDAN
추천 : 0
조회수 : 415회
댓글수 : 4개
등록시간 : 2016/10/09 18:10:58
제목 없음.jpg




제 질문 글을 봐주셔서 감사합니다.


이전 문제는 해결이 되었는데요, 이렇게
이름
비밀번호
자기소개

우측에 있는 input, textarea를 왼쪽에 딱 맞게 정렬을 하고싶습니다.


전에 올린 게시글의 댓글을 보니 고정너비값을 주면 된다고 하셔서 시도를 해보았으나 제대로 되질 않습니다.


제가 시도한 방법은 <span style="position:absolute;width:170%;"> 예를 들어서 이렇게 해보았는데요,



고정너비 설정하는 방법을 정확히 모르겠습니다.



마진으로 시도를 해보았으나, 크롬 / 사파리 / 익스플로어 브라우저마다 각각 다른 모습을 보여 정렬이 되지 않습니다.


사파리에는 정렬이 되어 보였으나, 크롬과 익플에서는 더 삐뚤빼뚤 해보이는 현상이요 ..



<form>

<div class="put">

<span style="position:relative;width:10%;">이름</span>

<input type="text"/>

</div>

<div class="put">

<span style="position:absolute;left:300px; right:0;top:500px;bottom:0;">비밀번호</span>

<input type="password"/>

</div>

<div class="put">

<span style="float:left;position:relative;width:10%;">자기소개</span>

<textarea cols="80" rows="12"></textarea>

</div>

<input type="submit" value="가입하기"/>

</form> 


body 부분이구요,


.put {margin-top:10px;}

.put input[type="text"]{/*margin-left:128px;*/border-radius:20px 20px 20px 20px;}

.put input[type="password"]{/*margin-left:100px;*/border-radius:20px 20px 20px 20px;}

.put textarea{/*margin-left:106px;*/border-radius:20px 20px 20px 20px;}

input[type="submit"]{width:63%;/*margin-left:160px;*/border-radius:20px 20px 20px 20px;}

input:focus{

background-color:orange;

}

.put>textarea:focus{

background-color:orange;

}



위에 스타일 부분입니다.



스타이 부분에 주석처리 해 놓으신것을 보면 마진으로 시도해보았지만, 잘 안됩니다....


* 예외 : 테이블 태그를 이용하면 안됩니다 .. 디브를 사용해서 해야합니다.


꼭 한번 봐주시고 이 문제가 해결이 되었으면 좋겠습니다 !

전체 추천리스트 보기
새로운 댓글이 없습니다.
새로운 댓글 확인하기
글쓰기
◀뒤로가기
PC버전
맨위로▲
공지 운영 자료창고 청소년보호