2011-05-11 80 views
1

我有一個Twitter的佈局,以及八九不離十..主表還挺看起來像它,與它的切片註銷的方式...主要內容的div不會居中

html { 
    -webkit-user-select: none; 
    text-shadow: 2px 2px 2px #000; 
    color: #fff; 
    font-smooth: always; 
    padding: 0; 
    width: 100%; 
    height: 100%; 
    background: url("./img/main_back.jpg"); 
    background-size: cover; 
    background-attachment: fixed; 
    background-repeat: no-repeat; 
} 

body 
{ 
    height: 100%; 
    width: 100%; 
} 

.content_wrap { 
    position: relative; 
    top: 5px; 
    display: inline-table; 
    margin-right: auto; 
    margin-left: auto; 
    width: 90%; 
    height: 100%; 
    background-color: transparent !important; 
} 

.left_table { 
    overflow: hidden; 
    display: table-cell; 
    text-align: center; 
    width: 50%; 
    height: 100%; 
    padding-left: 5px; 
    padding-bottom: 20px; 
} 

.right_table { 
    display: table-cell; 
    text-align: center; 
    width: 20%; 
    height: 100%; 
} 

HTML5文檔類型 頭< - 向左浮動 部分< - 右浮動

部分< - 內容包 部分< - left_table 一邊< - right_table 頁腳< - 固定位置,底部0px

標記是現貨,我一直檢查它與w3c網站。

無法將其置於中心,偏離中心大約30至40px,任何人有任何想法?

+0

建議:在Google上搜索「2列CSS佈局」,不要使用'inline-table'或'table-cell'。如果你打算這麼做的話,你最好還是用桌子。 – Nicole 2011-05-11 19:57:15

+2

請加價! – Jawad 2011-05-11 19:57:48

+0

由於某些原因無法添加html ..但我編輯了我的主帖並解釋了它最好的我可以... – Crustified 2011-05-11 20:34:45

回答

0

我注意到,在無處夜代碼實際上,你有你的內容DIV中心...

也許你說這個?

body 
    { 
     height: 100%; 
     width: 100%; 
     text-align: center; 
    } 

此外,第一條評論有一點。

+2

'text-align:center'以內聯內容爲中心,而不是塊元素。 'margin-left/right:auto'(在'.content_wrap'上設置)涵蓋了這些。 – 2011-05-11 20:00:44

+0

使用內嵌表格和表格單元格是因爲我無法將左右表格拉伸到頁面底部並保持並排。只要我確定它伸展到底部。雖然它不會伸展到谷歌瀏覽器或Safari瀏覽器的底部,但只適用於歌劇,IE9和FF4(尚未測試舊版本)@cbroughton text-align:center;只是推了它約40更多像素中心..; 0( – Crustified 2011-05-11 20:19:17

+0

好吧,我修好了,很好sorta.LOL ..我只是應用了一些負邊緣,並把它拉回22px。嘗試了一切我能想到的,我只是couldn不要讓它以汽車邊距爲中心...我可以將顯示器從容器中取出,它可以工作,但是我失去了100%的身高。我真的不想讓它看起來像右側是100%的高度,我想它是100%的高度,所以我想這是我唯一的選擇。你知道,這些PHP函數,登錄/註冊,甚至是MySQL數據庫並不像這個問題那麼大。LoL – Crustified 2011-05-11 20:59:16