尽管位于顶部，div 仍不向下移动

Question

尽管位于顶部，div 仍不向下移动

很抱歉我尝试了一切，尝试了三十分钟却什么也没得到。好的，这是我的代码。由于某种原因，“div2”不起作用，也不能向下移动，但只能左右移动。我希望它能够从屏幕顶部或底部上下移动，但它只能左右移动，并且与导航栏位于同一水平面上

body {
   background-color: LightGoldenRodYellow;
   font-family:"Arial Black", Gadget, sans-serif;
 }

 #rightcolumn {
  float: left;
 margin-left: 100px;
 }

#wrapper {
 background-color: #33CC00;
 color: #000066;
}

 #midcolumn {
  float: left;
  width: 100px;  
  Margin: 15px;
 }

 #leftcolumn {
 float: left;
 width: 100px;
 margin: 10px;
 }

 #footer {
    clear: both;
    position: relative;
     z-index: 10;
    height: 3em;
    margin-top: -3em;
}


  .navbar {
  text-decoration: none;
  margin: 15px;
 display: block;
 }

 .div2{
 position:absolute;
 float: left;
 left: 200px;
 margin-top:100px:
 }


 .title{
 color: LightCoral;
 position:absolute;
 left: 50%;
 top: 10%;
 }

 .titlesub{
 color: Green;
 position:absolute;
 font-size: 12pt;   
 left: 50%;
 top; 30%;
 }


 .content{
 color: LightCoral;
 }

Run Code Online (Sandbox Code Playgroud)

确定下一个文件

<!doctype htm>

<html>

<head>
<link href="midterm_helper.css" rel="stylesheet" type="text/css" />
<title>Vacation Destination </title>

</head>


<body>

<h1 class="title">

Vacation Island

<p class="titlesub">

~vacation awaits!

</p>




</h1>

<p class="div2">
        test
        </p>



        <div>
            <a class="navbar" href="hotel_form.html" target="_blank">Reservations</a>

             <a class="navbar" href="hotel_room.html"         target="_blank">Rooms</a>

            </div>




















</body>

</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Nic*_*ick 6

如果你们中有人真的费心阅读他的代码，您会发现他有一个冒号：在他的顶级样式后面而不是分号；

这将做你想做的事。浮动：左；不过没有必要:)

.div2 {
  position:absolute;
  float: left;
  left: 200px;
  margin-top:100px;
}

Run Code Online (Sandbox Code Playgroud)

归档时间：	11 年，7 月前
查看次数：	7690 次
最近记录：	6 年，4 月前