這樣一個需求,第三方聯合登陸的頭像和昵稱整體水平居中,如圖:

對于這樣的需求,不能簡單的對包含頭像和昵稱的div使用margin: 0 auto了,因為昵稱的長度是未知的。
solution 1:利用行內元素的padding-left屬性。把圖片絕對定位到padding-left區域內,然后對外層div元素設置文字居中,對span元素設置line-height,讓文字垂直居中
效果圖:
 
solution 2:box布局居中,對div元素設置box-pack,span元素設置display: block,由于想偷懶,省略兼容模式寫法
| 
 
 | 
新聞熱點
疑難解答