'정렬'에 해당되는 글 2건

  1. Square 3.4 패치 노트
  2. CSS 가로뿐만이 아니라 세로로도 가운데 정렬하기

Square 3.4가 릴리즈되었습니다. 카드 형식에 따른 글자 정렬 기능과 세부적인 성능 향상과 디자인 수정이 적용되었습니다.


http://square.tarks.net


Square 3.4 패치 노트


http://square.tarks.net


Square 'Square 3.4 패치노트' - http://tarks.net/square/0HHa6gQlViNa


1. 정렬 기능 추가

글자 정렬을 원하는 형식에 따라 가운데를 중심으로 정렬 혹은 왼쪽부터 작성되도록 정렬할 수 있도록 업데이트되었습니다.



2. 이 외 개선점

디자인 세부 요소 변경 및 성능 향상.

저작자 표시 비영리 동일 조건 변경 허락
신고

'Square' 카테고리의 다른 글

Square 3.4 패치 노트  (0) 2017.09.26
Square 3.3 패치 노트  (0) 2017.07.22
Square 3.2 패치 노트  (0) 2017.07.06
Square 3.1 패치 노트  (0) 2017.07.03
페이스북 생일 축하 글로 뭘 써야 할지 고민이 될 때  (0) 2017.06.23

가로 방면에서 가운데를 정렬하게 하는 방법은 잘 알려졌지만, div 안에서 세로로도 가운데 정렬하는 건 약간 더 까다로운 편입니다. 텍스트가 여러 줄이 되어도 비율을 맞춰 가운데 정렬하게 할 수 있습니다.


 

CSS 가로뿐만이 아니라 세로로도 가운데 정렬하기


CSS 부분

<style>


.outer {
display: table;
width: 300px;
margin-top: 24px;
}

.tablerow {

display: table-row;

}

.content {

width:300px;
height: 300px;

vertical-align: middle;
display: table-cell;

}

</style>


HTML 부분

<div class="outer">
<div class="tablerow">
<div class="content">

가운데에 있을 내용
</div>
</div>
</div>


저작자 표시 비영리 동일 조건 변경 허락
신고