텍스트가 왜 가운데에 있지 않습니까?

여기에서 코드를 볼 수 있습니다. - http://jsfiddle.net/tz6tnbub/텍스트가 왜 가운데에 있지 않습니까?

이것은 내 HTML입니다.

<div class="choice"> 
<h1>Choose your Semester </h1> 
</div>

그리고 이것은 제 CSS입니다. 내가하고 싶었던 무엇

.choice { 
    color: white; 
    background-color: #D8DACF; 
    border: 1px solid #cc0000; 
    padding: 30px; 
    margin-right: auto; 
    margin-left: auto; /*Doesn't work??? Why not?*/ 
    color:#F53F39; 
}

센터이었다 "당신의 학기 선택"내가 말을 들었다 "마진 오른쪽 : 자동차"와 "여백 왼쪽 : 자동"작동합니다.

하지만 그렇지 않습니다. 그리고 저는 붙어 있습니다.

잘못 되었으면 알려주십시오. block 요소로

출처

2014-12-08 Adarsh Rao

텍스트를 가운데 맞춤하려면 'text-align : center' 사용 – Jaiff

['tex t-align : center'를 'h1'에 올렸습니다. (http://jsfiddle.net/chipChocolate/tz6tnbub/1/). –

오. 예, 작동합니다. 하지만 자동차가 작동하지 않을 때 왼쪽/오른쪽 여백을 설정하는 것이 왜 효과가 없다고 말할 수 있습니까? (내가 codecademy에서 알아야 할 것이있다.) –

h1 행동하는 당신이 단순히 fixedwidth

.choice { 
    color: white; 
    background-color: #D8DACF; 
    border: 1px solid #cc0000; 
    padding: 30px; 
    /* margin-right: auto; */ /* remove this */ 
    /* margin-left: auto; */ /* remove this */ 
    color: #F53F39; 
    text-align: center; /* add this */ 
}

출처

2014-12-08 18:12:09

내가 당신의 문제는 당신이 사업부에 설정하는 것이 생각 갖는 요소에 대해 부모에게

margin:0 auto 작품을 text-align을 추가하여 align 수 중심이되지만 폭이나 높이가 없으므로 추상입니다. div가 정확하게 가운데 맞춤되어 있지만 크기가 무한대이므로 텍스트가 시작 부분에 있으므로 왼쪽 위 모서리를 의미합니다.

아마 당신은이 작업을 수행해야합니다

.choice { 
    color: white; 
    background-color: #D8DACF; 
    border: 1px solid #cc0000; 
    padding: 30px; 
    margin-right: auto; 
    margin-left: auto; 
    color:#F53F39; 
    width: 40px; 
}

을 또한, 그것은 대부분의가있는 좋은 사이트입니다 http://w3schools.com/ 를 방문하십시오

width: 15%;

같은 화면 비율로 크기를 선택할 수 있습니다 필요한 경우 CSS, HTML 및 자바 스크립트의 기능

출처

2014-12-08 20:12:23

텍스트가 왜 가운데에 있지 않습니까?

답변

관련 문제