左右の幅を固定で中央を残り全部広げる

テンプレ

ex.左100px　右150px　中央は100%に広げたい

left
100px
center
右と左の残り
right
150px;
1
2
3
4
5
<div class="tablewidth">
<div class="tablewidth_left">left<br />100px</div>
<div class="tablewidth_center">center<br />右と左の残り</div>
<div class="tablewidth_right">right<br />150px;</div>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
.tablewidth{
max-width:700px;
margin:50px auto;
text-align:center;
display:flex;
}
 
.tablewidth_left{
width:100px;
background:#ff0000;
}
 
.tablewidth_center{
flex:1;
background:#c0c0c0;
}
 
.tablewidth_right{
width:150px;
background:#0072ff;
}

勉強させてもらったサイト

コメントを残す

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です

▲