너비가없는 수평 중앙 블록

Question

다른 너비의 블록이 3 개 있습니다. 나는 각 블록을 수평 적으로 중심에두기를 원한다. 그리고 주요 텍스트 아래의 텍스트는 텍스트 정렬로 갖는다. 사진보기

어떻게 할 수 있습니까?

이미지 = http://www.nahraj-obrazek.cz/pt-313937842321.png

Answer 1

이 시도 : 당신은 당신의 원하는 효과를 달성하기 위해 display: table;을 사용할 수 있습니다

.block 
{ 
    display:inline-block; 
    margin: auto; 
    position: relative; 
} 

p.right 
{ 
    position:absolute; 
    right:0; 
    bottom:0; 
} 

Answer 2

. display: table;에서 div까지 두 텍스트가있는 가운데에 margin: auto;을 적용하여 가운데에 정의하십시오. 오른쪽에 맞추려는 텍스트는 text-align: right; 스타일로 작성하십시오. 그게 다야.

코드가 적습니다.

#center { 
    text-align: center; 
} 
.someblock{ 
    display: table; 
    margin: 0 auto; 
    background-color: yellow; 
} 
.someblock p { 
    text-align: right; 
} 

라이브 예 :

AND DEMO FROM FIDDLE YOU PROVIDED

div { 
    margin: 0 auto; 
    display: table; 
} 
div p { 
    text-align: right; 
} 

Answer 3

간단한 방법이 수행하는 알 수없는 폭으로 http://jsfiddle.net/6Mp34/

Answer 4

을

*, *:before, *:after { 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    box-sizing: border-box; 
} 

.wrap { 
    text-align: center; 
} 
.row { 
    margin: 1em 0 0 0; 
    display: inline-block; 
    position: relative; 
} 
.row:first-child { 
    margin: 0; 
} 
.author { 
    text-align: right; 
    display: block; 
} 

http://fiddle.jshell.net/9SqTe/7/
http://fiddle.jshell.net/9SqTe/7/show/