Re: 伸縮容器 'space-around' 裡兩邊與中間的空白差異

会不会是为了和margin属性的行为区别开呢？

于 2012/7/26 3:37, Kang-Hao (Kenny) Lu 写道:
> 我發現這個問題在 www-style 上討論過兩次，提供一下連結：[1][2]
>
> (12/07/18 13:43), Hawkeyes Wind wrote:
>> space-around的定义恐怕是为了算法上偷懒才这么设计的吧。
>> 在一个宽度1000px的行中，若存在3个box，宽度分别为200px，200px，300px，那
>> 么空余的宽度为300px。
>> 在宽度这个方向上，每个box有两条边，那么每条边与相邻元素的距离应为
>> 300px/6=50px。
>> 为了和margin做出区别，box的宽度在计算的时候包括了间距，于是box与父元素边
>> 缘的间距为50px，而两个box之间的距离变成了双倍 的100px。
>>
>> 以上是我猜的。
> 我覺得「box的宽度在计算的时候包括了间距」不太對，因為布局上沒什麼必要這
> 樣做。
>
> 然後就簡單的角度來講，300px/(3*2) 絕對不會比 300px(3+1) 的計算來得簡單，
> 所以我不覺得就實作的角度來講這有什麼差。'space-around' 應該要是一個比較
> 常用的情形。
>
>> 不过我个人还是觉得box到父元素边缘等于box间距离比较好看些。
> 在之間的討論中，很有意思的是，要求 'space-around' 的人是要求你這個行為
> 的，但是他附的圖[3]卻是現在規範的「中間兩倍間隔」的行為。我本來也直觀覺
> 得不要這樣比較好看，不過我也發現，比如說 Mac 的 Finder 的圖示配置也是
> 「中間兩倍間隔」[4]，另外我的 Nokia 手機的圖示也是。
>
> 我覺得這裡需要一些圖來佐證一下「box到父元素边缘等于box间距离比较好看」，
> 不然很容易掉到文字錯覺陷阱裡。
>
> [1] http://lists.w3.org/Archives/Public/www-style/2012Jan/thread#msg170
> [2] http://lists.w3.org/Archives/Public/www-style/2012May/thread#msg554
> [3] http://terrainformatica.com/w3/eq-distr-buttons.png （圖示的配置）
> [4]
> http://lists.w3.org/Archives/Public/www-archive/2012Jul/att-0028/mac-finder
>
>
> 以上
>
> Kenny

-- 
Regards

Hawkeyes Wind

Received on Thursday, 26 July 2012 13:49:47 UTC