我已经在并排(排)div上阅读了一堆SO问题/答案,但我不认为我抓住了它,因为我无法找到我特定设置的解决方案:
http://www.trforums.com/h18-iwaku
基本上,我希望最底层的div位于"嘿,什么是","导航,"和"连接"盒子,而不是在它们之下。这可能吗?
div本身只是具有相应html内容的类。这是非常基本的,但这是我的代码:
我的HTML非常生疏,所以其他建议非常受欢迎。谢谢你的帮助。
答案 0 :(得分:1)
尝试围绕DIV中的每一列:
<!-- Left column -->
<div id="leftColumn">
<div class="ex">
<center><img style="display: inline;" src="http://i.imgur.com/wCP3WP3" alt="" /></center>
<h1>Hey, what's up?</h1>
</div>
<div class="navbar">
<b>NAVIGATION:</b> <a href="http://joshpho.weebly.com/zukan.html">Zukan</a> | <a href="http://joshpho.weebly.com/movies.html">Movies</a> | <a href="http://joshpho.weebly.com/retsuden.html">Retsuden</a> | <a href="http://joshpho.weebly.com/misc.html">Photography</a> |
</div>
<div class="connect">
<b>CONNECT:</b> <a href="http://joshpho.livejournal.com/profile">Livejournal</a>
</div>
</div>
<!-- Right column -->
<div id="rightColumn">
<div class="slideshow">
Bottom div that I want in a row with the top one...
</div>
</div>
CSS:
#leftColumn {
float: left;
width: 410px; // Width of this column
}
#rightColumn {
float: left;
width: 500px; // Width od this column
}
答案 1 :(得分:1)
答案 2 :(得分:0)
在您希望彼此相邻的div上使用float:left
或display:inline
。