-4

我<div>在一个容器中有两个标签。其中一个向右浮动，另一个向左浮动。我正在尝试将它们排成一行，但问题是右侧的位于左侧的下方，并且根本不浮动。

http://tinkerbin.com/QuHxRQXO

4

2 回答 2

0

检查这个小提琴。

它不是在正确的浮动，因为您正在为您div的 's 提供填充，这使您的.rightsidediv 降到最低。而不是给div' 填充填充给内部元素。

而不是给px你div的给百分比。它可以帮助您理解模式。

我从您的 div 中删除了填充，并向内部元素添加了填充，如下所示。

h4,p{padding:5px;}
于 2012-09-24T05:34:01.727 回答
0 
It  is working fine. I have checked except.

change
<font color= "#FFFFFF"><b>Site Contents</b>
 to
<font color= "#FFFFFF"><b>Site Contents</b></font>

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title> new document </title>
<style type="text/css">
.subcontent{width:750px;}
.menu {
background-color :#FFD700;
float: left;
padding-bottom: 100px;
width:170px;
font-family: Verdana;
font-size: 12px;
}
.rightside {
background-color: #FFF;
float:left;
width:540;
padding-left:10px;
}
</style>
</head>
<body>
<div class="subcontent">
<div class="menu">
    <div class="submenu"  style= "background-color:#A80000; text-align:center; width:120px; padding:10px"> 
        <font color= "#FFFFFF"><b>Site Contents</b></font>
    </div>

    <h4><b>Virtual Tour</b></h4>
    <P>Explore the lab to know the insights of the new world!</p>
    <h4><b>Experiments</b></h4>
    <P>There is lot more to it that would fascinate you.</P>
    <h4>Lab History</h4>
    <P> Find out the need to make it underground.</P>
 </div>

 <div class = "rightside">
      <div id="separator" style="background-color: #A80000; height: 20px">
      </div>
          <p id="para1"> Located 2,341 feet beneath the surface in an old iron mine, the lab is deep enough that particle physics experiments see less than 100,00 times the cosmic radiation than on the surface, allowing sensitive searches for exotic particles like neutrinos and dark matter.</P>
     </div>
  </div>
 </body>
</html>
于 2012-09-24T05:28:52.140 回答