将一个div定位到另一个div的右侧

Question

将一个div定位到另一个div的右侧

7

我有以下的html和css。但是我无法弄清楚如何将标签页div放置在主div的右侧，以便它们像书签一样从右侧突出。

.main {
    -moz-border-radius:10px;
    height: 75%;
    width: 60%;
    position: absolute;
    top: 15%;
    left: 20%;
    right: auto;
  }
.tabs {
    width: 50px;
    height: 1.3em;
    position: absolute;
    float: right;
}
 #tab { margin: 10px 10px 10px 0px;}

并且html：

<div class="main">
    <div id="content">
       Some main content
    </div>
 </div>
 <div class="tabs">
     <div class="tabs" id="tab1">
         <a href="#" alt="Home">
             Home
         </a>
      </div>
      <div class="tabs" id="tab2">
          <a href="#" alt="About">
              About
          </a>
      </div>
</div>

- Jonno_FTW

ID应该是唯一的--将#tab改为.tab可以避免以后出现问题。此外，锚点没有alt属性。尝试使用title代替。 - user241244

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- cletus · Accepted Answer

将块元素左对齐有两个常用方法：

使它们变为内联元素；或者
使用浮动。

第一种方法可以是：

div.main, div.tabs { display: inline; }

(2)的意思是：

div.main, div.tabs { float: left; }

如果你选择（2），将div放入容器并添加以下代码：

div.container { overflow: hidden; }

每种方法都有其独特的优点。尤其是inline元素不能应用margin属性。这只是HTML中关于内联和块布局的几个限制之一。