2

我知道制作了大约 100 个主题,我已经尝试了所有 100 个主题,但我无法让它工作,如果您签到,请在中间对齐图像

http://one1.no-ip.org/index.php?hitta=tanto&page=search

您会看到徽标位于屏幕顶部,无论我做什么,我都无法使其正确对齐。我确定有什么东西在干扰,但我就是不知道是什么,我什至做了一个小提琴来检查我使用的方法是否有效

http://jsfiddle.net/UJATF/ 图片位于 div 元素中间的工作示例

CSS

 .logo{
    background:white;
    position:absolute;

    width:105px;
    height:90px;
    line-height:90px;
    left:180px;
    margin-top:20px;

    line-height:90px;
    text-align:center;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

    box-shadow:inset 0px 0px 0px 1px white,inset 0px 0px 10px -4px black;
    z-index:1000;
    overflow:hidden;    
}
.logo img{
    vertical-align:middle;
    max-width:90px;
    max-height:40px;
}

HTML

<div class="logo">
<a href="./index.php?page=profile&amp;id=377948"><img src="http://www.tantobil.se/images/logo.png"></a>
</div>

所以所有的帮助将不胜感激

4

2 回答 2

1

定义你的锚链接display : inline-block并给margin-top

像这样

.logo > a {
    display: inline-block;
    margin-top: 22px;
}

结果是

在此处输入图像描述

--------

您是否正在使用动态与而img不是习惯于 第二个选项是

.logo > a {
    display: table-cell;
    height: 90px;
    text-align: center;
    vertical-align: middle;
    width: 105px;
}
于 2012-11-29T10:58:13.860 回答
0

既然您在 CSS 中使用固定高度,为什么不使用简单的数学来确定top徽标的位置?

.content 高 121px,.logo 高 90px

区别是 31px,这意味着您需要 15.5px 的顶部偏移量。另外,将 .content 设置为,position: relative以便将徽标相对于 .content 的顶部定位。

于 2012-11-29T10:58:31.037 回答