로그인 "사용자 이름"및 "비밀번호"필드를 포함하는 필드 세트를 페이지 중앙에 놓으려고합니다. 다음은 내가 가지고있는 것입니다.CSS로 필드 세트 중심 지정
fieldset{
border: 1px solid rgb(255,232,57);
width: 400px;
float: left;
}
창 크기에 관계없이 필드 세트의 가운데에 표시하려고합니다. 검색으로 인해 float: center 또는 align: center과 같은 유용한 정보가 생성되지 않았습니다.
float: center, 왼쪽 및 오른쪽 만 존재하지 않습니다. Float은 블록 레벨 요소를 스택 플로우에서 빼내어 수평 정렬 할 수 있습니다. display:inline-block과 유사하지만 플로트 방향과 정렬됩니다.
원하는 것은 여백을 자동으로 설정하는 것입니다. 당신이 노드를fieldset 내부 정렬 중심하려는 경우, 당신은이에 text-align:center;을 추가 할 수 있습니다
fieldset{
border: 1px solid rgb(255,232,57);
width: 400px;
margin:auto;
}
오 신 나는 미쳐야합니다. 확실히 Downvote 자격. – Chris
하하 걱정할 필요가 없습니다. downvote는 나에게서 아니었다. +1 균형을 맞추려면 :) – AlienWebguy
요소 포장은 가능성이 텍스트 정렬이 필요합니다 : 센터; 그 다음에는 필드 세트에 여백을 설정해야합니다.
fieldset{
//other stuff
margin: 0 auto;
text-align: left;
}
form
{
text-align: center;
}
필드 집합이 자동 좌우 대칭이있는 블록 수준으로 표시되면 줄 바꿈 요소에 text-align을 설정하는 것은 관계가 없습니다. – lsuarez
@lthibodeaux IE의 일부 구형 버전은 문제가있을 수 있으므로 일반적으로 삽입합니다. 최신 브라우저는 관계가 없습니다. –
그게 문제를 해결하지 않습니다. 배치 상위 만 중심으로 조정됩니다. 내용은 구성 요소의 가운데에 맞춰지지 않습니다. –
누군가가 실제로 바로 작동이 사촌 사용 ...이 시도!
fieldset {
font-size:14px; padding:5px; width:500px; line-height:1.8; margin: 0 auto;
}
중요한 것은'margin : 0 auto; '입니다. 이는 앞의 두 대답에서 이미 언급했습니다. 그렇다면이 답변은 어떤 가치를 더합니까? – EWit
단지 float:left를 제거하고 float:left는 부모 요소의 왼쪽에 당신의 요소를 유지하기 때문에 margin: 0 auto;를 추가합니다. (상위 요소 너비가 400px 이상이라고 가정하면) 새 CSS는 다음과 같습니다.
fieldset{
border: 1px solid rgb(255,232,57);
width: 400px;
margin: 0 auto;
}
당신은 또한 같은 fieldset를 넣을 수 있습니다 :
<div style="text-align:center">
.......fieldset here........
</div>
참고 :이 또한 fieldset 텍스트의 정렬에 영향을 미치는, 그래서 당신이 fieldset 내부의 텍스트를 원하는 경우 왼쪽 또는 오른쪽 정렬해야
<fieldset style="text-align:left">
float 대신 'margin : auto'를 사용하십시오. – hollandben