2016年10月3日 星期一

float left轉inline-block地雷

今天下班前de不出來的一個bug,
試問以下兩個code出來的結果有何不同:

old.html

<div style="width: 1000px;height: 500px;">
  <div style="float: left;width:70%;height:100%;background: #145"></div>
  <div style="float: left;width:30%;height:100%;background: #222"></div>
</div>

bug.html

<div style="width: 1000px;height: 500px;">
  <div style="display: inline-block; width:70%;height:100%;background: #145"></div>
  <div style="display: inline-block; width:30%;height:100%;background: #222"></div>
</div>

你會發現bug.html怎麼樣都沒辦法把底下兩個div正確地塞進上層的div裡,
 bug.html底下兩個div中間會多出一條莫名其妙的空白線,但你用chrome/firefox inspector怎麼看兩個div的padding/border/margin 都找不到那條空白線到底是哪裡來的。

==========無用防雷線=============

解答:

 inline-block對外層來說兩個div排列是inline所以那個白線來自html排版中的空白text node,你需要把兩個div間的空白完全拿掉才能成功排列:

<div style="width: 1000px;height: 500px;">
  <div style="display: inline-block; width:70%;height:100%;background: #145"></div><div style="display: inline-block; width:30%;height:100%;background: #222"></div>
</div>

2016年9月30日 星期五

IIS NOTE

一個LAMP派使用者轉到IIS的心得

IIS是很nice的,這其中一定有什麼誤會,IIS是一個什麼東西都可以GUI設定的web server,不過前提是你要找的到就是了顆顆,我都是先找到文字檔怎麼設定最後才發現原來GUI可以找到對應選項。不過如果你找不到還是可以直接編輯網站對應的web.config(相當於apache的.htaccess)。


Troubleshooting

Q: 上傳檔案傳完後response 404 not found
A: 除了檢查PHP.ini裡upload_max_filesize欄位外,IIS本身有限制request的maxAllowedContentLength。IIS設定方式 在左側樹狀圖中點選站點>右側功能檢視中點選"要求篩選">最右側動作點選"編輯功能設定">彈出視窗中的"允許的內容長度上限"欄位輸入新的限制數值。官方文件說預設只有28MB左右超過就會噴404(對debug一點幫助都沒有的response)