居中的絕對定位的div

我需要居中這個div被包裹另一個DIV中：居中的絕對定位的div

股利爲中心：

.post-username { 
    padding: 10px; 
    background: #000; 
    border-radius: 4px; 
    position: absolute; 
    top: 0; 
}

應該的這個內部居中：

.post { 
    background: #3e4758; 
    overflow: hidden; 
    border-radius: 4px; 
    width: 270px; 
    height: 330px; 
    position: relative; 
}

來源

2015-06-25 btmach

可能的重複http://stackoverflow.com/questions/15376634/how-can-i-center-a-div-within-another-div？ –

那麼div .post-username應該是靈活的，爲它設置一個寬度可能是一個壞主意，因爲某人的用戶名可能是兩個字符，而某個人的是十二個？ – btmach

.post-username { 
    padding: 50px; 
    background: #000; 
    border-radius: 4px; 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    -webkit-transform: translate(-50%, -50%); 
    -moz-transform: translate(-50%, -50%); 
} 

.post { 
    background: #3e4758; 
    overflow: hidden; 
    border-radius: 4px; 
    width: 270px; 
    height: 330px; 
    position: relative; 
}

來源

2015-06-25 15:17:07

.post-username { 
 
padding: 10px; 
 
background: #000; 
 
border-radius: 4px; 
 
position: absolute; 
 
left: 50%; 
 
top: 50%; 
 
transform: translate(-50%, -50%); 
 
} 
 

 
.post { 
 
background: #3e4758; 
 
overflow: hidden; 
 
border-radius: 4px; 
 
width: 270px; 
 
height: 330px; 
 
position: relative; 
 
}

<div class="post"> 
 
<div class="post-username">asdasd</div> 
 

 
</div>

來源

2015-06-25 15:17:21

居中的絕對定位的div

回答

相關問題