CSS - 不能向右发送div?

时间:2013-10-11 13:46:24

标签: css html

我正在尝试使用float发送div块到我页面的右侧:右边;但它不起作用。

HTML:

    <div id="footer_div">
<footer>

<div class="copyrights">
<a href="contact.html" style="
    color:#8C8C8C;
    font-weight:bold;
    text-decoration:none;
    font-size:xx-small;
"><center>Site © 2013</center></a>
</div>  


<div class="footer_links">
<a href="cgu.html" style="
    color:#FFF;
    font-weight:bold;
    text-decoration:none;
    font-size:xx-small;
">Conditions d'utilisation</a>
<a href="about.html" style="
    color:#FFF;
    font-weight:bold;
    text-decoration:none;
    font-size:xx-small;
">A propos</a>
<a href="help.html" style="
    color:#FFF;
    font-weight:bold;
    text-decoration:none;
    font-size:xx-small;
">Aide</a>
<a href="contact.html" style="
    color:#FFF;
    font-weight:bold;
    text-decoration:none;
    font-size:xx-small;
">Contact</a>
</div>

</footer>
</div>

CSS:

footer
{
    position:fixed;
    bottom:0;
    height:45px;
    width:100%;
    background:url(Templates/footer1.png) repeat-x bottom;
}

.copyrights
{
    float:left;
    position:fixed;
    bottom:17.5px;
    text-decoration:none;
    margin-left:8px;
}

.footer_links
{
    float:right;
    height:20px;
    width:240px;
    position:fixed;
    bottom:17.5px;
    text-decoration:none;
    border:0px solid;
}

知道如何解决这个问题吗? 我希望.footer_links转到我页面的右侧。

谢谢! 克里斯。

2 个答案:

答案 0 :(得分:2)

取消您在fixed课程中指定的职位.footer-links

请参阅此jsFiddle示例。

答案 1 :(得分:1)

http://jsfiddle.net/wCMqY/6/

footer
{
position:fixed;
bottom:0;
height:45px;
width:100%;
background:red;
}

.copyrights
 {
float:left;
bottom:17.5px;
text-decoration:none;
margin-left:8px;
}

.footer_links
{
float:right;
height:20px;
width:240px;
text-decoration:none;
border:0px solid;
background:green;
 }
.clear {
clear:both;
}

这是导致你出现问题的固定位置