블록 요소, 가로 가운데 정렬 및 최소 너비 가능

중간에 가로로 정렬되도록이 블록 요소를 갖기 위해 노력하고 있지만 동시에 내부 내용의 최소 가능 폭을 원합니다. 하지만 이건 내 현재 코드입니다 ... 그것이 가능이나 내가 나 자신을 할 수 아니에요블록 요소, 가로 가운데 정렬 및 최소 너비 가능

a#button-link { 
    background: url("images/button-link.png") no-repeat scroll center left; 
    margin: 12px auto 0 auto; 
    display: block; 
    width: 125px; 
    height: 32px; 
    line-height: 32px; 
    padding-left: 35px; 
    font-weight: bold; 
}

생각하지 않습니다 ...이 뒤에 아이디어는 태그의 텍스트가 약간있을 수 있다는 것입니다 사용자 언어 및 특정 사용자의 언어에 대해 동일한 문장의 문자에 따라 더 크거나 작습니다. 제어 할 수있는 방법은 없지만이 요소를 수평으로 정렬하여 중앙에 배치하고 싶습니다.

CSS로 가능합니까?

출처

2010-04-01 Ricardo Amaral

display:table을 사용하십시오.

업데이트

<!DOCTYPE html> 
<html lang="en"> 
<meta charset="UTF-8"> 
<title>display:table</title> 
<style> 
div 
    { 
     display:   table; 
     border-collapse: collapse; 
     border:    1px solid #950; 
     margin:    100px auto; 
    } 
* html div 
    { /* IE 6. If anybody finds a good solution for IE 7: Tell me! */ 
     width:    .1em; 
    } 
* + html div 
    { /* IE 7 Hack. Not perfect. */ 
     float:    left; 
     margin:    100px auto 100px 45%; 
    } 
</style> 

<div>Some Text.</div>

Live Demo

출처

2010-04-01 22:14:12 fuxia

하지만 IE (6?)에서 작동, 그것은 것입니다하지 않을 것이다? –

작동하더라도 괜찮습니까? 제 말은, div와 CSS를 사용하여 테이블을 피하고 이제 디스플레이 속성을 테이블로 설정한다는 것입니까? 약간의 아이러니 한 ... –

그냥 확인해도 IE6에서는 작동하지 않지만 걱정하지 않습니다. IE9는 이미 작동 중입니다. 3 가지 새로운 버전으로 사람들을 업데이트 할 시간입니다. –

블록 요소, 가로 가운데 정렬 및 최소 너비 가능

답변

관련 문제