0

これは私のHTMLです

<div id="footer">
    <div id="footer_content">
           &#169; 2012 Company, Inc.
           <ul>
                <li><a href="/contact">Contact</a></li>
                <li><a href="/terms">Terms</a></li>
                <li><a href="/privacy">Privacy</a></li>
           </ul>
    </div>
</div>​

これは私のCSSです

/* FOOTER */ 
#footer {
    position: relative; 
    margin-top: -60px; 
    text-size:12px; 
    height: 60px; 
    clear:both; 
    background-color: blue; 
    line-height: 60px; 
    text-align:right
} 
#footer_content { 
    width: 940px; 
    margin: 0 auto;
}
#footer ul { 
    list-style: none; 
    position: absolute; 
    top: 0px; 
}
#footer ul li { 
    float: left; 
    margin-right: 5px; 
}
#footer ul li a { 
    font-weight: bold; 
    margin-right: 5px; 
    text-decoration: none; 
}
#footer ul li a:hover {  }​

現在、著作権は右側にあり、リンクは左側にあります。逆のはずです。それらを動かすためにどのような調整を行うつもりですか？

4

3 に答える 3

1

Space Beers の言うことにはほぼ同意しますが、これを改善する方法はいくつかあります。

HTML:

    <div id="footer">
        <div id="footer_content">
           <ul>
               <li><a href="/contact">Contact</a></li>
               <li><a href="/terms">Terms</a></li>
               <li><a href="/privacy">Privacy</a></li>
           </ul>
           <div class="copyright">
               &#169; 2012 Company, Inc.
           </div>
        </div>
    </div>​

CSS:

    #footer {
        position: relative; 
        margin-top: -60px; 
        text-size:12px; 
        height: 60px;
        background-color: blue; 
        line-height: 60px; 
        text-align:right
    } 
    #footer_content { 
        width: 940px; 
        margin: 0 auto;
    }
    #footer ul { 
        float:right;
        list-style: none; 
    }
    #footer ul li { 
        display:block;
        float: left; 
        margin-right: 5px; 
    }
    #footer ul li a { 
        font-weight: bold; 
        margin-right: 5px; 
        text-decoration: none; 
    }

    #footer .copyright{
        float:left;
    }

これはブラウザと完全に互換性があるはずです。

于 2012-10-16T15:42:31.253 に答える
0

あなたの会社の情報を含む div に入れ、左にフロートします。

<div id="footer">
    <div id="footer_content">
       <div class="company_info">&#169; 2012 Company, Inc.</div>
       <ul>
          <li><a href="/contact">Contact</a></li>
          <li><a href="/terms">Terms</a></li>
          <li><a href="/privacy">Privacy</a></li>
       </ul>
     </div>
</div>​

.company_info{
    float: left;
}
于 2012-10-16T15:22:14.307 に答える
-2

display:inline;李クラスで使用

于 2012-10-16T15:29:57.213 に答える