在Chrome中，內聯元素不走內聯

Question

這是我的代碼：

HTML：

<div id="ip"> 
       <address> 
        <strong> Mblahblah: </strong> 
        <pre> xx.xxxx.xxx.xxxx. </pre> 
       </address> 
       <address> 
        <strong> blah: </strong> 
        <pre> xxx.xxxx.xxxxx </pre> 
       </address> 
      </div><!-- #ip --> 

在Firefox中，當我預先設定顯示內聯，它是幹什麼的我想要。兩者彼此相鄰。但在Chrome中，它並沒有。標題（strong中的內容）...位於地址上方的新行中。我究竟做錯了什麼？

CSS：

#ip { 
    border-left: 1px solid #b9b9b9; 
    float: right; 
    margin: -6px 0 15px 0; 
    padding: 0 0 0 93px; 

} 

pre, code { 
    background: #444; 
    color: #fff; 
    font-family: Consolas, Courier New, Monospace; 
} 

#ip address { 
    margin: 22px 0; 
} 

#ip address strong, #ip address pre { 
    display: inline; 
    padding: 2px 5px; 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
} 

#ip address pre { float: right;} 
#ip address strong { font-weight: bold; font-size: 20px; } 

第一個答案沒有工作。在Firefox中，但不是在Chrome ....是否有另一種解決方案，我可以用它來代替？下面是頭文件中所有CSS的部分。

header, .content-wrap, #main-content, nav { 
    width: 960px; 
    margin: 0px auto; 
} 

#logo { float: left; } 

#ip { 
    border-left: 1px solid #b9b9b9; 
    float: right; 
    margin: -6px 0 15px 0; 
    padding: 0 0 0 93px; 

} 

pre, code { 
    background: #444; 
    color: #fff; 
    font-family: Consolas, Courier New, Monospace; 
} 

#ip address { 
    margin: 22px 0; 
    clear: both; 
} 

#ip address strong, #ip address pre {  
    padding: 2px 5px; 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
} 

#ip address pre { float: right;} 
#ip address strong { float: left; font-weight: bold; font-size: 20px; } 
nav { 
    background: #49434a url(../images/nav-bg.jpg) repeat; 
    height: 40px; 
    margin: 30px 0; 
    -webkit-border-radius: 10px; 
    -moz-border-radius: 10px; 
    border-radius: 10px; 
    -webkit-box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.7); 
    -moz-box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.7); 
    box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.7); 
    border: 1px solid #000; 
} 

nav ul { 
    padding: 8px 20px; 
} 

nav ul li { 
    display: inline; 
    padding: 12px 25px; 
} 

nav ul li a { 
    color: #fff; 
    font-size: 19px; 
    text-shadow: -1px 1px 0 #000; 
} 

Chrome從未給我提出過問題。

Answer 1

我希望這是你要找的。看看我用你的代碼在JsFiddle上做了什麼：http://jsfiddle.net/Lpb8E/。

基本上，您所需要做的就是將地址和預元素設置爲float: left;。

Answer 2

該解決方案與GGCO相似，但它保持與在Firefox中正確顯示的佈局相同的佈局，而不是將預標籤與強標籤對接。它也尊重地址標籤上的邊距設置。

http://jsfiddle.net/aQNFQ/