如何在div的右側和左側有文字

我正在試圖製作一個左側圖像和左側圖像的標題。如何在div的右側和左側有文字

本質上，下面：

[LOGO HERE] Link1 Link2 Link3

我想用div而不是表格，我該如何在保持'流動性'的同時去做這件事。

這裏是我的容器CSS：

.container { 
    width: 85%; 
    max-width: 1260px; 
    min-width: 680px; 
    background: #FFF; 
    margin: 0 auto; 
}

這是我的頭CSS：

.header { 
    background: #FFF; 
    width: 100%; 
    height: 10%; 
} 
.header2 { 
    float: right; 
    width:49%; 

}

頭是圖像，標題2是文本。

這是我如何稱呼它：

<body> 

<div class="container"> 
    <div class="header"><a href="http://www.college.edu"><img src="http://newhope.edu/images/Logo.png" alt="" name="" width="40%" id="Insert_logo" style="background: #FFF; display:block;" /></a> 
    <div class="header2"> 
    test 
    </div> 
    <!-- end .header --></div>

如果你想看到的代碼的其餘部分，讓我知道。

我試圖讓自己的類，如header2所示。我只需要將標題分開，我真的不想使用表格。

謝謝！

來源

2013-07-12 Jared Tillford

我假設你的意思是「正確」的鏈接。試試這個：

.header { 
    background: #FFF; 
    float: left; 
    width: 50%; 
    height: 10%; 
} 

.header2 { 
    float: right; 
    width: 50%; 
}

並確保你有一個clear下，使內容不滾成，是這樣的：

<br style="clear: both" />

來源

2013-07-12 18:20:32 NinthCrow

謝謝您的答覆。看起來這不起作用！它只是這樣做：http://i40.tinypic.com/20gy42d.png 我希望它在右側居中（因爲我知道我的左邊，顯然） –

嗯......你可能有一些填充和/或邊距，這使得50％的寬度比實際的50％寬。嘗試拉出百分比。看到在這裏工作：http://jsfiddle.net/bebd3/ – NinthCrow

我做到了。這是完成後的輸出。 http://i39.tinypic.com/2r2vh91.png 任何想法，或者我只是qwopping？ –

如何在div的右側和左側有文字

回答

相關問題