Question

我遇到了div的问题。它必须如下所示：http://cl.ly/2r0S043m301p410T2e3z但它看起来像这样：http://cl.ly/3h1t0f471W0V1U3j2S0y它真的很烦人。

这是HTML：

<html xmlns="http://www.w3.org/1999/html">
<head>
  <link href="<?php echo base_url('css/style.css');?>" rel="stylesheet" type="text/css" />
  <title>Admin :: Home</title>
</head>
<body>
<div id="wrapper">
  <div class="admin-form">
    <div class="header">
      <h1>Admin Home</h1>
    </div>
    <div class="content dashboard">
      <ul>
        <li><a href='<?php echo base_url('admin/DiveLocations');?>'<span class="addDiveLocation"><img src='<?php echo base_url('images/icons/scubadiving.png');?>'/><p>Duiklocaties</p></span></a></li>
        <li><a href='<?php echo base_url('admin/Users');?>'<span class="addDiveLocation"><img src='<?php echo base_url('images/icons/users.png');?>'/><p>Gebruikers</p></span></a></li>
      </ul>
    </div>

  </div>
</div>
</body>
</html>

以下是该内容框的CSS：

.admin-form .content .input {
  width: 188px;
  height: 100%;
  padding: 15px 25px;
  margin-left: 100px;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #9d9e9e;
  text-shadow: 1px 1px 0 rgba(255,255,255,1.0);

  background: #fff;
  border: 1px solid #fff;
  border-radius: 5px;

  box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
  -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
  -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
}

Answer 1

我假设你已经浮出了li或a。在这种情况下，您应该将clearfix类添加到父容器

<div class="content dashboard clearfix">

这是clearfix类代码：

.clearfix:before,.clearfix:after{
  content:'\0020';
  display:block;
  overflow:hidden;
  visibility:hidden;
  width:0;
  height:0
}
.clearfix:after{clear:both}
.clearfix{zoom:1}

Answer 2

您没有关闭代码。这是错字吗？

<a href='<?php echo base_url('admin/DiveLocations');?>'<span...

应该是

<a href='<?php echo base_url('admin/DiveLocations');?>' ><span..

我的内容超出了div

2 个答案: