css - 使用 div 而不是表格的基本布局

标签 css layout html

---------------------------------
menu
---------------------------------|
content                 |Feeds   |
                        |        |
                        |        |
---------------------------------|

我想使用 div 来分隔内容和 Feed,而不是使用表格

我试过了

CSS。

#left
{
   clear:left;
   float:left;
   position:fixed;
}
#right
{
   float:right;
   position:absolute;
}

html.

<div>
   <div id="left">Content</div>
   <div id="right"> Feeds</div>
</div>

最佳答案

Check this out.

<div id="container">
    <div id="menu">Menu</div>
   <div id="left">Content</div>
   <div id="right"> Feeds</div>
    <div id="footer"> Footer</div>
</div>


body{
    width: 760px;
    margin: 0 auto;
}
#container{
    position:relative;
}
#menu
{
    border: 4px solid orange;
}
#left
{
      float:left;   
}
#right
{
   position:fixed;
    right: 10px;
    top: 25px; /*Change as per your need */            
}
#footer{
    border: 4px solid aqua;
    clear:both;
}

关于css - 使用 div 而不是表格的基本布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9340939/

相关文章:

c# - Windows 窗体布局引擎

html - 使用 CSS 等列流体高度和流体宽度列布局

javascript - 在 IndexedDB 中存储图像文件

css - 如何在不知道尺寸的情况下使用css从左右裁剪图像

html - 悬停不使用 anchor 标记 html 中图像下方的文本

javascript - CSS 背景图片不显示 IE8

objective-c - 带有 xib 的 UIView 忽略尺寸类别

javascript - 尝试从 window.open() 访问传递的 URL

javascript - 如何更改背景图片?

jquery - Bootstrap - 为较小的视口(viewport)更改 Affix 数据偏移