Question

我正在使用我购买的模板在WordPress上工作。我在网站顶部添加了一个div，其中唯一的元素是链接。

我需要将它与页面的其余元素对齐，所以我使用左边的填充。问题是，当我调整窗口大小时，页面的其余元素正在移动，但我无法使链接以相同的方式移动。

我尝试了'位置'，但没有运气。

这是我正在使用的代码：

<div id="extra_header">
        <a class="specialLink" href="http://www.fitnessforum.gr">FITNESSFORUM.gr</a>
        </div>

CSS

#extra_header{
    height:26px;
    background-color: #ac0003;
    display: block;
    }

    a.specialLink:link {
    color: #eeeeee;
    font-size: 12px;
    font-family: arial;
    font-weight: normal;
    font-style: normal;
    line-height: 26px;
    float: left;
    margin-left: 260px;
    }


    a.specialLink:hover { 
    color: #FFFFFF; 
    font-size:12px;
    font-family: arial;
    font-weight:normal;
    font-style:normal;
    text-decoration:underline;
    float: left;
    margin-left: 260px;
    line-height:26px;
    }

此处还有指向该网站的链接：www.topgreekgyms.fitnessforum.gr

Answer 1

添加到#extra_header

width:1020px;
margin:0 auto;

并将margin-left:260px调整为您想要的内容..

此外，您无需复制:hover规则中的所有属性。

只是那些从链接的正常状态改变的那些。

所以

a.specialLink:hover { 
    color: #FFFFFF; 
    text-decoration:underline;
}

Div不会与页面的其他元素一起移动

1 个答案: