0

嗨,有人可以帮我解决这个问题,因为我已经尝试了一切。

我正在尝试对齐名为“包装器”的 div 内的中心内容。

无论我做什么内容都不会对齐页面的中心。希望有人可以帮助我谢谢。

CSS:

body {
        font-family:Arial, Helvetica, sans-serif; 
        font-size:medium; 
        color:#3f3f3f; 
        background:#26265d; 
        padding:0; 
        margin:0;
        text-align:center;
    }

.wrapper {width:100%; overflow:hidden; margin:auto; display:block; text-align:center;
     position:relative; margin-left:auto;
margin-right:auto;


}

html:

<div class="wrapper">
<?php include("includes/mod_home/mod_newest.php"); ?>
</div>

php页面:

<?php
        $newest_set = get_newest_member();
        $newest_count = mysql_num_rows($newest_set);
        while ($newest = mysql_fetch_array($newest_set)) {
        $strn = "".$newest['display_name']."";
        $max = 13;
        if(strlen($strn) > $max) {
        $strn = substr($strn, 0, $max) . '...'; } 
$photo = "../data/photos/{$newest['id']}/_default.jpg";

if (!file_exists($photo)) {
    $photo = "../data/photos/0/_default.jpg";
}

            echo"
            <div class=\"mod_newest_image\">
            <a href=\"profile.php?id={$newest['id']}\"><img width=95px src=\"".$photo."\"/></a>

            </div>";

    }
    ?>


<style>

.new_text{
    color:#373775;
    position:absolute;
}
.mod_newest_image img{
    border:2px solid #6f6f6f;
    -moz-box-shadow: 0px 0px 5px #CCC;
    -webkit-box-shadow: 0px 0px 5px #CCC;
    box-shadow: 0px 0px 5px #CCC;
    width:95px;
    height:120px;
    display:block;
 float:left;
 position:relative;
 margin:3px;

 }
</style>
4

2 回答 2

1

如果您尝试使用 margin: 0 auto; 将其居中,则您的包装器的宽度不能为 100% 您需要为包装器提供小于 100% 的值才能使其正常工作。

.wrapper {width:1000px; overflow:hidden; margin: 0 auto; }
于 2013-04-25T19:14:35.820 回答
0

wrapper need size,不需要position:relative

如果您的图像大小与包装不同。您可能需要添加margin: 0 auto;以对齐包装器内部的中心

于 2013-04-25T19:19:41.017 回答