위키
포럼
도구
바뀐글
랜덤

"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...)
 
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>


==같이 보기==
==같이 보기==

2017년 1월 2일 (월) 00:35 판

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=229565"
문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}