위키
포럼
도구
바뀐글
랜덤

"CSS display table, table-cell"의 두 판 사이의 차이

(새 문서: ;CSS display table, table-cell ==예시== <source lang='html'> <style> .row { width: 100%; display: table; } .box { display: table-cell; } .box-a { background: red; } .box-b { ba...)
 
잔글 (Jmnote님이 CSS display table 문서를 CSS display table, table-cell 문서로 이동했습니다)
 
(같은 사용자의 중간 판 2개는 보이지 않습니다)
19번째 줄: 19번째 줄:
</source>
</source>
<jsfiddle>fe1p43w5</jsfiddle>
<jsfiddle>fe1p43w5</jsfiddle>
==예시 2==
<source lang='html'>
<style>
.row {
  width: 100%;
  display: table;
}
.box { display: table-cell; }
.box-a { background: red; width: 50px; }
.box-b { background: orange; }
.box-c { background: yellow; width: 50px; }
</style>
<div class="row">
  <div class="box box-a">A</div>
  <div class="box box-b">B</div>
  <div class="box box-c">C</div>
</div>
</source>
<jsfiddle>r585LL1t</jsfiddle>


==같이 보기==
==같이 보기==
* [[CSS display 속성]]
* [[CSS display 속성]]
* [[HTML table 태그]]


[[분류: CSS3]]
[[분류: CSS3]]

2017년 1월 2일 (월) 00:36 기준 최신판

CSS display table, table-cell

1 예시[ | ]

<style>
.row {
  width: 100%;
  display: table;
}
.box { display: table-cell; }
.box-a { background: red; }
.box-b { background: orange; }
</style>

<div class="row">
  <div class="box box-a">A</div>
  <div class="box box-b">B</div>
</div>

2 예시 2[ | ]

<style>
.row {
  width: 100%;
  display: table;
}
.box { display: table-cell; }
.box-a { background: red; width: 50px; }
.box-b { background: orange; }
.box-c { background: yellow; width: 50px; }
</style>

<div class="row">
  <div class="box box-a">A</div>
  <div class="box box-b">B</div>
  <div class="box box-c">C</div>
</div>

3 같이 보기[ | ]

원본 주소 "https://zetawiki.com/w/index.php?title=CSS_display_table,_table-cell&oldid=229567"
문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}