css - 有一个单独的 div 与其他的连续吗?

标签 css html

我已经阅读了一堆关于并排(行)div 的 SO 问题/答案,但我认为我没有掌握它,因为我找不到适合我的特定设置的解决方案:

http://www.trforums.com/h18-iwaku

基本上,我希望最底部的 div 位于“嘿,怎么了”、“导航”和“连接”框的右侧,而不是就在它们下方。这可能吗?

div 本身只是具有相应 html 内容的类。这是非常基本的,但这是我的代码:

http://pastebin.com/AQrqqewA

我的 html 很生疏,所以非常欢迎其他建议。感谢您的帮助。

最佳答案

尝试用 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
}

关于css - 有一个单独的 div 与其他的连续吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17336543/

相关文章:

javascript - 下拉菜单和内容按国家/地区变化

JavaScript--使 <BR/> 标记处于事件和非事件状态

html - Bootstrap 时间轴响应式布局问题

block - CSS block 并排

html - 为什么带有嵌套ul的<div>会导致填充宽度过大

html - 针对深度嵌套的元素

javascript - 文本在不同浏览器中的大小不同

javascript - ngClick 上的三元条件

javascript - 显示滚动区域外的元素

html - 导航 Sprite 未显示为背景图像