Question

我有一个标题，它以我的div的一半而不是整个div为中心。请帮忙！

这是HTML：

<div id="services"> <span2>Fees and Insurance</span2>

这是CSS：

#services {
 height:500px;
 background:#f9fbfb;
 text-align:center;
 font-weight:100;
 font-size:35px;
 padding:50px;
}

span2 {
 font-size:40px;
 margin-left:px;
 text-align:center;
}

以下是完整代码：

＆＃13;

    <!DOCTYPE html>
    <html>
    <head>
    <title>Title</title>
         <meta charset="UTF-8">
         <title>Website</title>
      <meta name="author" content="WebDev">
         <link href="example.css" rel="stylesheet" type="text/css" />
      <style>
      
      html { 
     font-family: "Open Sans";
    	font-size: 24px;
    	font-style: light;
    	font-variant: normal;
    	font-weight: 500;
    	line-height: 26.4px;
    }
    
    body { 
     background:  linear-gradient(#fff 30%, #CCFFFF );
     margin-top:10px ;
     margin-right:75px;
     margin-left:75px;
    }
    #container { 
     width:1300px; 
     margin:0 auto; 
     background:#iff;
    }
    
    #header { 
     width:100%; 
     height:170px; 
     background:#Fff;
     }
     
    #logo { 
     float:left; 
     width:400px; 
     height:85px; 
     margin:30px; 
     background:#fff;
     color: #000;
     font-size: 40px;
     line-height:35px;
     position:absolute; 
    }
    span1 { font-size: 30px;
            line-height: 18px;
    
    
    }
    #navbar { 
     height:20px;
     clear:both;
     background: #Fff;
    }
    #navbar ul { 
     margin:10px; 
     padding:1px; 
     list-style-type:none;
     line-height: 40px; 
    }
    #navbar ul li { 
     padding:px; 
     float:right ; 
     margin-top:120px;
    }#navbar ul li a { 
     font-size:24px; 
     float:right ; 
     float:right ;
     padding:0 0 0 20px; 
     display:block;
     text-decoration:none;
     font-weight:100;
     color:#000;
    }
    
    #services {
     height:500px;
     background:#f9fbfb;
     text-align:center;
     font-weight:100;
     font-size:35px;
     padding:50px;
    }
    
    span2 {
     font-size:40px;
     margin-left:px;
     text-align:center;
    }
    
    #foot {
     font-size:25px;
     font-weight: 200;
     margin-right:75px;
     margin-left:90px;
     line-height:40px;
     margin-top:50px;
    }
    
    #test {
       height: 300px;
       width: 480px;
       background-image: url(http://www.berkeleywellness.com/sites/default/files/field/image/ThinkstockPhotos-471791462_1_field_img_hero_988_380.jpg);
       background-repeat: no-repeat;
       margin-top:85px;
       margin-right:;
       margin-left:90px;
       border-radius:25px;
       float:left;
       overflow:hidden;
       background-position:90%;
       background-size:172%
       clear:both;
    }
    ul2 {
     text-align:left;
     font-size:20px;
     float:right;
     position:relative;
     width:550px;
     margin-top:57px;
     line-height:35px;
     list-style:none;
     margin-right:60px;
     clear:both;
    }
    
    p2 {
     text-align:left;
     font-size:20px;
    }
    
    h4 {
     text-align:center;
     margin: 60px;
     font-weight:;
     float:center;
    }
    
    #end {
     height:180px;
    }
    
      </style>
    </head>
    <body>
    <!-- container -->
     <div id="container">
     <!--  header -->
     <div id="header">
      <div id="logo">
    James Brewer, M.D. <span1> santa barbara pediatrician </span1>
    </div>
      <div id="navbar">
       <ul>
       <li><a href="contact.html">contact </a></li>
        <li><a href="gallery.html">gallery &nbsp;|</a></li>
        <li><a href="fees&insurance.html">fees & insurance &nbsp;|</a></li>
        <li><a href="hours&location.html">hours & location&nbsp; |</a></li>
        <li><a href="services.html">services &nbsp;|</a></li>
        <li><a href="about.html">about &nbsp; |</a></li>
       </ul>
       </div>
      </div>
      <!-- content area -->
      <div id="content_area">
     <div id="services"> <span2>Fees and Insurance</span2>
    <div id="test"></div>
    <div id="text">
    <ul2>
     <li>The office accepts all PPO insurance.</li>
     <li>&nbsp</li>
     <li>We accept Cencal and Medi-cal.</li>
     <li>&nbsp</li>
     <li>New patient consultations are provided at no cost.</li>
     <li>&nbsp</li>
     <li>We regret that we do not take HMO insurance.</li>
    </ul2>
    </div>
    </div>
    </div>
     <div id=end>
    <h4>
    <p id="foot">2421 Bath Street, Suite A
    </p><p id="foot">
    Call for an appointment today 
    1-805-563-0167 
    </p>
    </h4>
    </div>
     </div><!-- end container -->
    </body>
    </html>

＆＃13;

文字居中于错误的位置

0 个答案: