«   2018/12   »
            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31          
Archives
Today
149
Total
1,189,512
안정적인 DNS서비스 DNSEver
관리 메뉴

Blue Breeze

Div, Text 중앙, 가운데 정렬 본문

FrontEnd/CSS

Div, Text 중앙, 가운데 정렬

푸른바람 C/H 2015.04.10 08:30

중앙정렬

1. Div 중앙정렬 2. Text 중앙, 가운데 정렬 * IE7 이하에서 tabel-cell 기능은 없음.

IE에서 동일하게 동작하도록 수정



<div style="display:block; width: 99%; height: 500px; position: relative;  border: 4px solid #aaa; border-radius: 4px; background-color: #eee;">
	<div style="display: block; width: 200px; height:200px; color: #fff; background-color: #000; position: absolute; top: 0; left: 0; bottom: 0; right:0; margin: auto;">
		<div style="display: table; width: 100%; height: 100%;">
			<p style="display: table-cell; text-align: center; vertical-align: middle;">
				Center
			</p>
		</div>
	</div>
</div>

IE8 까지는 된다. 하지만 IE7에서는 안된다.

Center

'FrontEnd > CSS' 카테고리의 다른 글

bootstrap dl-horizontal  (0) 2016.08.11
부트스트랩 +iconmoon  (0) 2015.07.06
Div, Text 중앙, 가운데 정렬  (0) 2015.04.10
css hack  (0) 2014.03.04
CSS odd & even rules  (0) 2010.08.11
네비게이션 링크  (0) 2009.04.24
0 Comments
댓글쓰기 폼