2

这是我正在处理的网站的链接： http: //students.bcitwebdev.com/jlandon/geordieirving/index.php。

我有一个问题......边距自动居中......但它有点偏离。其他人可以看到这个吗？真的很困扰我。

这是我的html：

<!DOCTYPE html>
<html lang="en">

<head>
<link rel="stylesheet" type="text/css" href="geordie.css" />
<script type="text/javascript" src="geordie.js"></script>

<title>Home</title>
<meta charset="UTF-8"/>

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="./galleria/galleria-1.2.8.min.js"></script>
<script type="text/javascript" src="./galleria/plugins/flickr/galleria.flickr.min.js">    </script>

<script type="text/javascript">
$(document).ready(function(){

Galleria.loadTheme('./galleria/themes/classic/galleria.classic.min.js');
$("#galleria").galleria({
    autoplay: 5000,
    responsive: true,
    height: .57,
    imageCrop: false,
    thumbCrop: 'height',
    carousel: true,
    showInfo: true,
    swipe: true,
    easing: 'galleriaOut',
    transition: 'pulse',
    flickr: 'search:Vancouver Whitecaps FC vs. San Jose Earthquakes',
    flickrOptions: {
        max: 30
    }
});

});
</script>

</head>

<body>
<?php
//header
include("header.php");
?>

<div id="content">

<div id="galleria"></div>

</div>

<div id="footer"></div>

</body>

</html>

这是我的CSS：

@font-face          {   font-family:"sketchscala";
                    src:url('sketchscalasans-webfont.ttf');
                }

@font-face          {   font-family:"gudearegular";
                    src:url('gudea_regular.ttf');
                }

*                   {   margin:0;
                    padding:0;
                }

html, body          {   background-color:#1A1A1A;
                    height:100%;
                }

h1                  {   font-size:300%;
                }

h2                  {   color:#6EB89F;
                }

h3                  {   color:#7DB4B6;
                }

h4                  {   color:#76BCAE;
                }

p                   {   font-size:50%;
                }

hr                  {   height:22px;
                    background-image:url('hrimage2.png');
                    background-repeat:repeat-x;
                    border:none;
                }

ul                  {   list-style-type:none;
                }

li                  {   display:inline;
                }

#galleria           {   width:900px;
                    margin-left: auto;
                    margin-right:auto;
                    height:auto;
                    background:#000000;
                }                   

#container          {   min-height:100%;
                }

#header             {   background-image:url('debut_dark.png');
                    background-color:#333333;
                    height:100px;
                    width:100%;
                }

#title              {   color:#FFFFFF;
                    font-family:"sketchscala";
                    width:723px;
                    position:relative;
                    margin-left:auto;
                    margin-right:auto;
                    top:10px;       
                }

#nav                {   font-family:"sketchscala";
                    color:#FFFFFF;
                    width:480px;
                    position:relative;
                    margin-left:auto;
                    margin-right:auto;
                    top:10px;
                }

#nav a:link         {   color:#FFFFFF;
                    text-decoration:none;
                }

#nav a:hover            {   color:#999999;
                    text-decoration:underline;
                }

#nav a:visited      {   color:#FFFFFF;
                    text-decoration:none;
                }   

#content            {   font-family:"gudearegular";
                    color:#333333;
                    overflow:auto;
                    padding-bottom:271px;
                    padding-left:100px;
                    padding-top:10px;
                }

#content a:link     {   color:#333333;
                    text-decoration:underline;
                }

#content a:hover        {   color:#000000;
                    text-decoration:none;
                }

#content a:visited  {   color:#333333;
                    text-decoration:underline;
                }

#footer             {   position:relative;
                    margin-top:-271px;
                    height:271px;
                    width:100%;
                    clear:both;
                    background-image:url('bottom_border.png');
                }

哈尔普

4

3 回答 3

4

有一个padding-left: 100px;，#content删除它，一切看起来都很好！

于 2012-12-12T06:15:35.197 回答
2

删除padding-left你的#content 身份证

#content {
    color: #333333;
    font-family: "gudearegular";
    overflow: auto;
    padding-bottom: 271px;
    padding-left: 100px; //remove this line 
    padding-top: 10px;
}
于 2012-12-12T06:16:45.967 回答
0

转到 geordie.css 中的#content 样式并禁用“padding-left: 100px;”。之后它应该看起来很好。

于 2012-12-12T06:18:25.907 回答