問題描述
可能原因
圖片寬高被固定，或沒有設定最大寬度為父元素寬度造成。
<img alt="" style="width: 800px; height: 451px;" src="FileResource.axd?path=html%252Fimage%252Fch%252F1060605-%25E7%25B5%2584%25E7%25B9%2594%25E5%259C%2596.jpg">
<img alt="近3年A1類道路交通事故死亡人數統計" src="FileResource.axd?path=html%252Fimage%252Fch%252F%25E9%25AB%2598%25E9%25BD%25A1%25E9%25A7%2595%25E9%25A7%259B%25E5%25B0%2588%25E5%258D%2580%252F%25E5%25B7%25A5%25E4%25BD%259C%25E5%258D%2580%25E5%259F%259F%25201.jpg">
此此問題可能為 所見即所得 編輯器造成的
建議修改
增加 max-width: 100% 以及 高度設定為自動調整 height: auto;
問題描述
可能原因
table 似乎有做 RWD 設計（Class 有套），但似乎又是被所見即所得編輯器將寬高寫死了。
<div class="table-responsive" style="width: 812px; height: 846px;">
<table class="table table-bordered table-striped table-hover" cellspacing="0" cellpadding="5" border="1">
<caption>
活期性帳戶繳費作業參加單位一覽表
</caption>
<tbody>
<tr class="table-title01">
<th class="telerik-reTableHeaderFirstCol-4">
代號</th>
<th class="telerik-reTableHeaderFirstCol-4">
金融機構名稱</th>
<th class="telerik-reTableHeaderFirstCol-4">
代號</th>
<th class="telerik-reTableHeaderFirstCol-4">
金融機構名稱</th>
<th class="telerik-reTableHeaderFirstCol-4">
代號</th>
<th class="telerik-reTableHeaderFirstCol-4">
金融機構名稱</th>
</tr>
<tr>
<td>
004</td>
<td>
臺灣銀行</td>
<td>101</td>
<td>
瑞興商業銀行</td>
<td>803 </td>
<td>聯邦商業銀行 </td>
</tr>
<tr>
<td>
005</td>
<td>
臺灣土地銀行</td>
<td>
102</td>
<td>
華泰商業銀行</td>
<td>805 </td>
<td>遠東國際商業銀行 </td>
</tr>
<tr>
<td>
006</td>
<td>
合作金庫商業銀行</td>
<td>
103</td>
<td>臺灣新光商業銀行</td>
<td>
806 </td>
<td>元大商業銀行</td>
</tr>
<tr>
<td>
007</td>
<td>
第一商業銀行</td>
<td>
108</td>
<td>
陽信商業銀行</td>
<td>807 </td>
<td>永豐商業銀行</td>
</tr>
<tr>
<td>
008</td>
<td>
華南商業銀行</td>
<td>
114</td>
<td>
基隆第一信用合作社</td>
<td>808</td>
<td>玉山商業銀行</td>
</tr>
<tr>
<td>
009</td>
<td>
彰化商業銀行</td>
<td>
115</td>
<td>
基隆第二信用合作社</td>
<td>809</td>
<td>凱基商業銀行</td>
</tr>
<tr>
<td>
011</td>
<td>
上海商業儲蓄銀行</td>
<td>
118</td>
<td>
板信商業銀行 </td>
<td>810 </td>
<td>星展(台灣)商業銀行</td>
</tr>
<tr>
<td>
012</td>
<td>
台北富邦商業銀行</td>
<td>
119</td>
<td>
淡水第一信用合作社 </td>
<td>812 </td>
<td>台新國際商業銀行</td>
</tr>
<tr>
<td>
013</td>
<td>
國泰世華商業銀行</td>
<td>130 </td>
<td>
新竹第一信用合作社</td>
<td>814 </td>
<td>
大眾商業銀行</td>
</tr>
<tr>
<td>
016</td>
<td>
高雄銀行</td>
<td>132</td>
<td>新竹第三信用合作社</td>
<td>815 </td>
<td>日盛國際商業銀行</td>
</tr>
<tr>
<td>
017</td>
<td>兆豐國際商業銀行</td>
<td>
146</td>
<td>台中市第二信用合作社</td>
<td>816</td>
<td>安泰商業銀行</td>
</tr>
<tr>
<td>
021</td>
<td>
花旗(台灣)商業銀行</td>
<td>147</td>
<td>
三信商業銀行</td>
<td>822 </td>
<td>中國信託商業銀行 </td>
</tr>
<tr>
<td>
022</td>
<td>
美國銀行台北分行</td>
<td>162</td>
<td>
<p>
彰化第六信用合作社</p>
</td>
<td>910 </td>
<td>
<p>財團法人農漁會</p>
<p>聯合資訊中心</p>
</td>
</tr>
<tr>
<td>039</td>
<td> 澳盛(台灣)商業銀行</td>
<td>165</td>
<td>彰化縣鹿港信用合作社</td>
<td>922</td>
<td>臺南市臺南地區農會</td>
</tr>
<tr>
<td>048</td>
<td> 王道商業銀行</td>
<td>204</td>
<td>高雄市第三信用合作社</td>
<td>928</td>
<td>
<p>板橋區農會電腦共用中心</p>
</td>
</tr>
<tr>
<td>
050</td>
<td>
台灣中小企業銀行</td>
<td>
215</td>
<td>
花蓮第一信用合作社</td>
<td>951</td>
<td>
<p>新北市農會附設北區</p>
<p>農會電腦共同利用中心</p>
</td>
</tr>
<tr>
<td>
052</td>
<td>
渣打國際商業銀行</td>
<td>
216</td>
<td>
花蓮第二信用合作社</td>
<td>952 </td>
<td>
<p>財團法人農漁會南區資訊中心</p>
</td>
</tr>
<tr>
<td>053 </td>
<td>
<p> 台中商業銀行</p>
</td>
<td>600</td>
<td>
<p>財團法人全國農漁業</p>
<p>及金融資訊中心</p>
</td>
<td>954</td>
<td>
<p>財團法人農漁會</p>
<p>附設中區資訊中心</p>
</td>
</tr>
<tr>
<td>054</td>
<td> 京城商業銀行</td>
<td>605</td>
<td>高雄市高雄地區農會</td>
<td>997</td>
<td>
<p>中華民國信用合作社</p>
<p>聯合社南區聯合資訊處理中心</p>
</td>
</tr>
<tr>
<td>
081</td>
<td>
匯豐(台灣)商業銀行</td>
<td>700 </td>
<td>中華郵政</td>
<td>
</td>
<td>
</td>
</tr>
</tbody>
</table>
</div>
建議修改
移除 table 中的 style 屬性（width & height)
問題描述
可能原因
濫用表格排版…XD
應採用流動是佈局或 flex (推薦)
關於 flex 可以參考
http://flexboxfroggy.com/
問題描述
可能原因
播放器外層有做了 RWD，但嵌入的播放器本身的寬高是已被固定
建議修改
使用 Youtube 自己原生的播放器進行嵌入，並在 iframe 套用 CSS 限定寬高（使用相對單位，而非固定值），並加上最大值限制
相對單位： %、vw/vh，但由於影片本身是有寬度的，因此使用 vh 或 vw 是較好的選擇
可以參考這裡 https://css-tricks.com/fun-viewport-units/
範例 Code:
<iframe style="width: 70vw; height: 39.375vw; max-width: 907px; max-height: 510px;" src="https://www.youtube.com/embed/Y1MszXx6EK8" frameborder="0" allowfullscreen></iframe>
使用效果可以參考 SITCON 2017 - SITCON 電影院
http://sitcon.org/2017/#schedule-page
