使图像在右侧对齐(或浮动)

时间:2012-01-26 16:18:06

标签: css image alignment wordpress

我安装了Wordpress用户照片插件,可以显示作者的照片。到目前为止一直很好,但我希望它不是在发布日期之后显示,而是与作者的姓名和发布日期平行。 以下图片解释了所有内容:

enter image description here

似乎我设法创建了一个新的CSS类。我在css中添加了:

featured-posts-block .user-photo {}

然后在循环中,我将用户照片代码包装在同一个CSS中,所以它现在是:

 

为了测试它,我添加了“border:2px solid blue;”到CSS,它出现了很好的..

但是我无法让它漂浮在文本的右侧,就像我在上面的照片中所展示的那样。感谢帮助。

如果您还想告诉我,如果我想在显示图片时调整图片大小,代码会是什么样子会很棒。

您可以看到它的网站: http://kuttabna.net

我用来显示那个块的代码:

<h2 class="entry-title"></a><a>" rel="bookmark" title="<?php printf(__('رابط  %s', 'framework'), get_the_title()); ?>"> <?php the_title(); ?></a></h2>

<!--BEGIN .entry-meta .entry-header-->
                        <div class="entry-meta entry-header">
                    <span class="published"> كتبها
                    <?php the_author_posts_link(); ?>  </span>
                    <span class="meta-sep">·</span>
                    <span class="published"> في <?php the_time( get_option('date_format') ); ?>
<?php userphoto_the_author_thumbnail() ?></span>
                            <!--END .entry-meta entry-header -->
                        </div>

1 个答案:

答案 0 :(得分:1)

图像正在div中打印出来,类user-photo为你的页面添加一个新样式,浮点数:右边的那个类..包括margin-left 5px只是为了一些间距。

<style type="text/css">
div.user-photo{
    float: right;
    margin-left: 5px;
}
</style>