2013-08-12 52 views
2

我想在以下代碼中將兩個div並排排列在一起,我已經放置了邊框以便您可以看到div邊界。如果有人可以幫助它,將不勝感激。獲取兩個div並排對齊

CODE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> 
<title>Untitled 1</title> 
</head> 

<body> 
<div id="picturecontainer1" > 
<img alt="logo" height="132" src="images/ClevelandLogo.gif" width="126"> 
</div> 
<div id="picturecontainer2"> 
<img alt="" height="132" src="da.png" width="1000" class="auto-style13"> 
</div> 

</body> 

+4

浮動左,右浮動,你有你的答案... –

+0

邊界在哪裏? – Simone

回答

0

JSfiddle

代碼:

<div id="picturecontainer1" > 
<img alt="logo" height="132" src="images/ClevelandLogo.gif" width="126"> 
</div> 
<div id="picturecontainer2"> 
<img alt="" height="132" src="da.png" width="1000" class="auto-style13"> 
</div> 

CSS:

div{ 
display:table-cell; 
} 
0

只需添加到您的CSS:

#picturecontainer1{ 
    float: left; 
} 

這樣你picturecontainer1是浮動的所以你picturecontainer2將調整添加picturecontainer1如果一側空間足夠寬,否則它會在div下面。

Jsfidde:

http://jsfiddle.net/uAK4Q/1/