在使用絕對定位實現未知寬高元素的時候產生了一些問題，具體問題是什麼，把下面的**拷到本地一起來玩吧。
這是一段描述
好的，這個沒有設定寬度的son元素已經憑內容自動撐開了，而且還在father裡居中了，效果相當棒~
下一步，我們來搞一點小動作，我們讓son的寬度撐的再開一些，最簡單的做法就是在描述資訊裡多加幾個字
這是一段描述這是一段描述這是一段描述
son容器不是自適應寬度嗎？為什麼才撐開到50%（200/400=0.5）就不行了呢？
ok，理由如下。
absolute定位的元素有乙個包含塊，包含塊是最近的帶定位的元素，在這裡就是father。
包含塊的自適應最大寬度 = father.width - son.left - son.right 這裡不考慮padding，margin
ok，原因找到了，有一種比較**的解決方案，我就說個思路，就是給son的外層再包乙個容器，他的寬度是father的200%，那麼son作為這個新增容器的兒子，他的最大自適應寬度就是200%*（100%-left50%）= 100%。這樣解決看起來很好，其實是會有問題的，尤其是你要給father容器新增事件，他的捕獲區域會增加一倍（mdzz)
請忽略上面的解決方案，我們繼續來玩這個東西
有人跟我講，給son加個display：inline-table，強制其子元素不換行試試，我加了之後。
竟然可以了~震驚！
再加幾句描述資訊試試。
發現，這種方案寬度最多適應到100%。
聯想到強制不換行這個特性，強制文字不換行我經常用，於是做了個實驗。用white-space：nowrap玩一下，結果如下
有哪位大神知道這是為什麼的在下面暢所欲言。膜拜
未知寬高元素垂直居中
給父元素display table 子元素display cell table,vertical align center，子元素即可居中 子元素絕對定位，top50 left50 transform translate 50 50 父元素flex，align items center justif...
css已知寬高和未知寬高的居中定位
1 已知寬高 上圖中我們想要對已知寬度的 服務範圍 進行左右居中定位，我們可以先選擇left或者right樣式，這裡我們選擇的是left，這裡的50 指的是這個盒子的最左側位於水平的百分之五十的地方，也就是中間位置，因為我們知道整體的寬度，所以我們可以直接採用在向左移動寬度的一半，也就是margin...
未知寬高元素垂直水平居中
最近加班像個牛一樣，很久沒來貼吧逛逛了，深感抱歉 上次有朋友發了個完美讓元素水平垂直居中的帖子，但是貌似僅限已知寬高的元素 沒仔細看，說錯了道歉 這次分享一下未知寬高元素水平垂直的方法。如果你曾經研究過水平垂直居中的方法，那麼下面這幾個方法你肯定知道 下面介紹的方法主要是利用display inli...