css样式用于在文本之前添加一些空格

时间:2015-03-07 07:22:15

标签: php html css html5 css3

我想在内容之前添加一些空格'内容' div标签。 现在我的所有文字都贴在左侧。内容中的所有文字都贴在左边。 我为p标签添加了margin-left样式。 fiddle

我试过

margin-left:10px;

但直到遇到问题。



.sidemenu {
  float: left;
  margin-top: 150px;
  width: 100%;
   }
.content {
  
 
  }
 hr {
      margin: 0;
      width: 1px;
      height: 660px;
      border: 0;
      background: #fff;
      float: left;
    }
.side{
  width: 24%;
  float: left;
  display: inline-block;
}
 .rest {
  height: 685px;
  background: -o-linear-gradient(bottom, #e5e3e3 5%, #ffffff 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e5e3e3), color-stop(1, #ffffff));
  background: -moz-linear-gradient(center top, #e5e3e3 5%, #ffffff 100%);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#e5e3e3", endColorstr="#ffffff");
  background: -o-linear-gradient(top, #e5e3e3, ffffff);
  background-color: #e5e3e3;
  border: 1px solid #f9f2f2;
  border-width: 0px 0px 0px 0px;
  border-radius: 0px 0px 10px 10px;
  padding: 0px 7px;
}
.outer {
  margin-left: 20%;
  margin-top: 3%;
  margin-bottom: 3%;
  height: 737px;
  width: 60%;
  box-shadow: 10px 10px 5px #888888;
  border: 1px solid #f9f2f2;
  border-radius: 10px;
  
}
 p{
      margin-left:100px;
    }

 <div class="outer">
                <div class="log">
                <h1>Profile</h1>
                       <form method="post" class="lout" > <button class="logout" name="logout" >Logout</button></form>
                       
                </div> <!--End of log div -->
                <div class="rest">
                  <div class="side">
                   <div class="sidemenu">
                        <div class="1 menu">
                          <a href="admin_dashboard.php" class="astext">Profile</a>
                        </div> <!--End of menu1 -->
                        <div class="2 menu">
                          <a href="clients.php" class="astext">Clients</a>
                        </div> <!--End of menu 2-->
                        <div class="3 menu">
                          <a href="employees.php" class="astext">Employees</a>
                        </div> <!--End of menu 3-->
                        <div class="menu 4">
                        <a href="admin_file_view.php" class="astext">Documents</a>
                        </div> <!--End of menu 4-->
                   </div> <!--End of side menu -->
                   </div>  <!--End of side div -->
                   <hr>
                    <!--  <div class="heading" >
                         <h1>Profile</h1>
                      </div>    End of heading div -->
                   <div class="content">
                       <?php
		     include "config.php";
		     if($ses!='')
		     {
		      $sql="select * from register where id=$ses";
		      $sql1=mysql_query($sql);
		      $fet=mysql_fetch_assoc($sql1);
		      $name=$fet['name'];
		      $email=$fet['email'];
		      $phone=$fet['phone'];
		      $cname=$fet['company_name'];
		      $street=$fet['street'];
		      $add=$fet['address'];
		      $city=$fet['city'];
		      $state=$fet['state'];
		      $ein=$fet['ein'];
		      $id=$fet['id'];
		     }
		    ?>
		    <form name="profile" method="post">
			
			
			 <p>Name<input type="text" size=20 maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $name; ?>"</p>
			 <p>Email<input type="text" size=20 name="mail" maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $email; ?>"</p>
			 <p>Phone<input type="text" size=20 maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $phone; ?>"></p>
			 <p>Company name<input type="text" size=20 maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $cname;?>"></p>
		         <p>Street<input type="text" size=20 maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $street;?>"></p>
			 <p>Address<input type="text" size=20 maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $add; ?>"></p>
			 <p>City<input type="text" size=20 maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $city;?>"></p>
			 <p>State<input type="text" size=20 maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $state; ?>"></p>
			 <p>EIN<input type="text" size=20 maxlength=50 style="background-color:transparent;border:0px solid white;" readonly value="<?php echo $ein;?>"></p>
			<a class="change">Change Password</a><br>
		  <div class="pass">
		     <br><input type="password" class="textbox" placeholder="Current Password" name="old" id="old" size="20"/><br><br>
                        <input type="password"  class="textbox" placeholder="New Password" name="new" id="new" size="20"><br>
                       <br><br><br><br><button class="add" name="go" id="go">Go</button><a style="padding-right:2ex;"></a><a class="change"><button class="add" name="cancel" id="cancel">Cancel</button></a>
		  </div> 
			 <br>
			 <div class="tri"><button name="edit" class=add>&nbsp&nbspEdit&nbsp</button><button name="add"  class="upload" onclick="admin()">Add New</button></div></form>
			  
			 
			
                   </div> <!--End of content -->
                </div> <!--End of rest div -->
          </div> <!--End of outer div-->
&#13;
&#13;
&#13;

3 个答案:

答案 0 :(得分:1)

你可以在这里看到演示 demo

我在form{padding-left:31%;}

进行了更改

尝试使用上边距的新

See Demo

在此修改.rest{margin-top:15%;}

答案 1 :(得分:0)

参见演示我可以添加一些CSS

http://jsfiddle.net/Lrh19c50/1/

form[name=profile] p{
padding-left:30%;
}

答案 2 :(得分:0)

您希望将div的一些空格添加到内容类中,因此您可以将.content div用作css选择器。这意味着内容类下的每个div,您可以根据需要提供填充。

.content div { padding-left : 30px; }