CSS中心圖像，右對齊文字

我正在爲朋友在http://blueridgemusclecars.com/的網站上工作。我希望徽標位於頂部中心，並且電話號碼和位置右對齊，但我希望文本與徽標水平相同。現在，文字位於徽標的右下方。這是我的標題CSS，任何想法？CSS中心圖像，右對齊文字

header { 
    width:100%; 
    position:relative; 
    z-index:2; 
} 

h1 { 
    padding:45px 20px 37px 26px; 
    /*background:url(../images/h1-bg.jpg) 0 0 no-repeat;*/ 
    /*float:right;*/ 

} 
    h1 a { 
     display:block; 
     width:500px; 
     height:278px; 
     text-indent:-999em; 
     margin:0 auto; 
     background:url(../images/logo.png) 0 0 no-repeat; 
    } 
.address { 
    display:block; 
    font-size:14px; 
    line-height:28px; 
    text-align:right; 
    color:#b22300; 
} 
.phone { 
    display:block; 
    font-size:25px; 
    line-height:30px; 
    text-align:right; 
    color:#fff; 
    margin-top:-5px; 
}

來源

2014-01-15 tracebell2000

對不起，我不是精通CSS，只是試圖把一個網站一起扔給朋友。 – tracebell2000

設置您的.fright類的負頂部邊距。

.fright { margin-top: -100px; }

來源

2014-01-15 00:46:43

好得多！非常感謝你！！ – tracebell2000

的標記很可能被重做一點點（例如，不知道爲什麼鏈接和圖像處於<h1>）這個頁面，我認爲是添加以下你的CSS，但最簡單的事情：

.wrapper { height: 300px; } //reduce empty space 
.fright { margin-top: -195px; } //align phone number with image bottom

這在Chrome中看起來還不錯......祝你好運！

來源

2014-01-15 00:54:48 chucknelson

CSS中心圖像，右對齊文字

回答

相關問題