텍스트의 텍스트 정렬이 작동하지 않습니다.

Question

this page을 참조하십시오.

"read more"버튼이 있습니다. (번역 - "czyta więcej"). 이것은 발췌 부분 바로 뒤에 있습니다. 이 버튼을 더 가운데에 배치하고 싶습니다.

class="readmorebtn" 

그리고이 CSS :

은 내가 a href에게 ... 다음 클래스 준

.readmorebtn{font-size:23px; text-align:center !important;} 

을하지만 어떤 이유로 제대로 동작하지 않습니다. 어떤 힌트? 당신은 당신의 버튼 a 요소를 사용하는

Answer 1

그렇게 a 요소는 기본적으로 inline, 그래서 당신 center이 텍스트는 자리가없는 경우에도 inline 요소 100% 수평 공간을 차지하지 않는 한에 중위 있도록, 중심 얻을 텍스트를 중심으로, 당신이 inline-block 또는

.readmorebtn { 
    display: block; 
    font-size: 23px; 
    text-align: center; /* No need of !important here */ 
} 

---

block 당신이 inline-block를 사용하는 경우 요소는 inline 및 block 될 것입니다해야하지만, 다시 말하면 inline-block 요소에 width을 정의해야합니다. 반면에 block 레벨 요소는 전체 수평 공간을 차지합니다.

Demo는 인라인 요소이기 때문에

Answer 2

이 요소는 폭을 가질 수 없습니다

Demo 2

(그것을 block 수준 요소 만들기) (당신이 블록 레벨 요소하지 않는 경우에 무엇을 참조하십시오) 폭이 없으면 가운데에 정렬 할 수 없으므로 display: inline-block; or display: block;을 추가해야합니다.

.readmorebtn { 
    display: block; 
    font-size: 23px; 
    text-align: center; 
}