Question

在我的网站http://goo.gl/16XdA上（“关于我们”一节）我想让蓝色标题与左边的挪威国旗垂直对齐。我尝试使用padding-bottom和margin-bottom（将蓝色标题移动几个px），但这根本不起作用。任何的想法？ TKS

CSS

#activity-container {
    width: 600px;
    background-color: #FFFFFF;
    font: 12px 'Open Sans', "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    color:#000;
    font-weight: 400;
    padding:25px;
    margin-left: auto;
    margin-right: auto;
    border: 1px dotted #666;
    background: #fff url(../images/norway-map.png) no-repeat right top;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=93)";
    filter: alpha(opacity=93);
    opacity: 0.93; /* For IE8 and earlier */
}

HTML

<div id="activity-container">
    <p><img src="images/norway-flag-small.jpg" alt="Picture" /><span class="activity-title">Swoåsa , naturlig mineralvann, ren natur</span></p>
    <br />
    <p>XXZ AS was founded</p>
  </div>

Answer 1

在标志图像上使用vertical-align: middle，这会将文本垂直放置在图像的中央。目前，该属性已从vertical-align: baseline文件设置为reset.css。

图像旁边的文本垂直对齐

1 个答案: