如何在我的div中居中图像库?

时间:2013-04-28 04:43:16

标签: image html center image-gallery

我正在尝试将PHP生成的图片库水平放置在页面上。看来我已经尝试了一切,但没有任何作用!以下是该页面的链接:http://rabbittattoo.com/?gallery=gallery

以下是图库的html:

<!-- Begin content -->
<div id="content_wrapper"><div class="inner">
  <!-- Begin main content -->
<div id="gallery_wrapper" class="inner_wrapper portfolio"><div class="standard_wrapper small"><br class="clear"></br><br></br>
  <!-- Begin portfolio content -->
<div class="one_fourth" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div><div class="one_fourth" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div><div class="one_fourth" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div><div class="one_fourth last" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div><br class="clear"></br><div class="one_fourth" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div><div class="one_fourth" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div><div class="one_fourth" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div><div class="one_fourth last" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div><br class="clear"></br><div class="one_fourth" style="margin-right:24px;margin-bottom:24px;margin-top:-20px"></div></div>
  <!-- End main content -->

关联的CSS:

#content_wrapper .inner .inner_wrapper.portfolio {
padding: 10px 0px 0px;
position: relative;
left: -10px;
}
#content_wrapper .inner .inner_wrapper {
margin-top: 28px;
}
#content_wrapper .inner .inner_wrapper {
width: 91%;
margin-left: 5.5%;
padding: 10px 0px 25px;
background: none repeat scroll 0% 0% transparent;
margin-top: 30px;
}
#gallery_wrapper {
width: 100%;
margin: 0px auto;
}

PHP:     

$pp_gallery_style = get_option('pp_gallery_style');
if($pp_gallery_style == 'f')
{
include_once(TEMPLATEPATH.'/gallery-f.php');
exit;
}

if(!isset($hide_header) OR !$hide_header)
{
get_header(); 
}

$caption_class = "page_caption";
$portfolio_sets_query = '';
$custom_title = '';

if(!empty($term))
{
$portfolio_sets_query.= $term;

$obj_term = get_term_by('slug', $term, 'photos_galleries');
$custom_title = $obj_term->name;
}
else
{
$custom_title = get_the_title();
}

/**
*   Get Current page object
**/
$page = get_page($post->ID);

/**
*   Get current page id
**/

if(!isset($current_page_id) && isset($page->ID))
{
$current_page_id = $page->ID;
}

if(!isset($hide_header) OR !$hide_header)
{
?>              
    <div class="wrapper_shadow"></div>
    <div class="page_caption">
        <div class="caption_inner">
            <div class="caption_header">
                <h1 class="cufon"><?php echo the_title(); ?></h1>
            </div>
        </div>
    </div>

    </div>

    <!-- Begin content -->
    <div id="content_wrapper">

        <div class="inner">

            <!-- Begin main content -->
            <div id="gallery_wrapper" class="inner_wrapper portfolio">

            <div class="standard_wrapper small">
                <br class="clear"/><br/>


<?php
}
else
{
echo '<br class="clear"/>';
}
?>  

                    <?php echo do_shortcode(html_entity_decode($page->post_content)); ?>

                    <!-- Begin portfolio content -->

                    <?php
                        $menu_sets_query = '';

                        $portfolio_items = 0;

                        $portfolio_sort = get_option('pp_gallery_sort'); 
                        if(empty($portfolio_sort))
                        {
                            $portfolio_sort = 'DESC';
                        }

                        $args = array( 
                            'post_type' => 'attachment', 
                            'numberposts' => $portfolio_items, 
                            'post_status' => null, 
                            'post_parent' => $post->ID,
                            'order' => $portfolio_sort,
                            'orderby' => 'date',
                        );                              
                        $all_photo_arr = get_posts( $args );

                        if(isset($all_photo_arr) && !empty($all_photo_arr))
                        {

                    ?>

                                        <?php

                                            foreach($all_photo_arr as $key => $portfolio_item)
                                            {

                                                $image_url = '';

                                                if(!empty($portfolio_item->guid))
                                                {
                                                    $image_id = $portfolio_item->ID;
                                                    $image_url[0] = $portfolio_item->guid;
                                                }

                                                $last_class = '';
                                                $line_break = '';
                                                if(($key+1) % 4 == 0)
                                                {   
                                                    $last_class = ' last';

                                                    if(isset($page_photo_arr[$key+1]))
                                                    {
                                                        $line_break = '<br class="clear"/><br/>';
                                                    }
                                                    else
                                                    {
                                                        $line_break = '<br class="clear"/>';
                                                    }
                                                }

                                        ?>
                                                        <div class="one_fourth<?php echo $last_class?>" style="margin-right:24px;margin-bottom:24px;margin-top:-20px">
                                                            <a title="<?php echo $portfolio_item->post_title?>" href="<?php echo $image_url[0]?>" class="one_fourth_img" rel="gallery" href="<?php echo $image_url[0]?>">
                                                                <img src="<?php echo get_stylesheet_directory_uri(); ?>/timthumb.php?src=<?php echo $image_url[0]?>&h=370&w=350&zc=1" alt=""/>
                                                            </a>
                                                        </div>

                                        <?php

                                                echo $line_break;
                                            }
                                            //End foreach loop

                                        ?>

                        <?php

                        }
                        //End if have portfolio items
                        ?>


                    </div>
                    <!-- End main content -->

                <br class="clear"/><br/>

            </div>

<?php
if(!isset($hide_header) OR !$hide_header)
{
?>              

    </div>
    <!-- End content -->


<?php get_footer(); ?>
<?php
}
?>

我尝试通过调整边距进行居中但没有效果。谁能告诉我我做错了什么?提前感谢您的帮助!

0 个答案:

没有答案