1

マスターページに次のコードがあります。

問題は FOOTER タグにあります。

 <%@ Master Language="VB" CodeFile="MasterPage.master.vb" Inherits="MASTER_MasterPage"    %>

 <!DOCTYPE html>

 <html xmlns="http://www.w3.org/1999/xhtml">
 <head runat="server">
 <title></title>
 <link href='http://fonts.googleapis.com/css?family=Fjalla+One' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
<script src="../JS/jq.js" type="text/javascript"></script>
<script src="../JS/jqui.js" type="text/javascript"></script>
<script src="../JS/script.js" type="text/javascript"></script>
<style type="text/css">


    html
    {
        background: url(images/bg.jpg) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

    #bigDiv
    {
        margin: auto;
        width: 1000px;
        height: 1000px;
        background-color: rgba(255,255,255,0.5);
    }

    header
    {
        height: 100px;
        background-color: white;
        font-family: "Source sans pro";
    }

    #menu a
    {
        text-decoration: none;
        color: white;
    }

    .menuItem
    {
        width: 20%;
        float: left;
        background-color: gray;
        height: 50px;
        font: normal 18px 'Fjalla One',sans-serif;
        color: white;
        padding-top: 30px;
        text-align: center;
        cursor: pointer;
    }

    #contentMain
    {
        float: left;
        width: 80%;
        background-color: rgba(255,255,255,0);
        height: 100%;
        overflow-y: scroll;
    }

    #content
    {
        height: 800px;
        background-color: rgba(255,255,255,0);
        font-family: "Source sans pro";
    }

    #contentAd
    {
        float: left;
        width: 20%;
        background-color: orange;
        height: 100%;
    }

    footer
    {
        text-align: center;
        background-color: gray;
        font-family: "Source sans pro";
        height:100px
    }

        footer a, label
        {
            text-decoration: none;
            color: white;
        }
</style>

</head>
<body>
<form id="form1" runat="server">
    <div id="bigDiv">
        <header>
            <h1>HR Softwares</h1>
            <h4>Advanced softwares and coaching</h4>
        </header>
        <div id="menu">
            <div class="menuItem">HOME</div>
            <div class="menuItem">SERVICES</div>
            <div class="menuItem">PRODUCTS</div>
            <div class="menuItem">CONTACT US</div>
            <div class="menuItem">NEWS</div>
        </div>
        <div id="content">
            <div id="contentMain">
                <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"></asp:ContentPlaceHolder>
            </div>
            <div id="contentAd">
                s
            </div>
        </div>
        <footer>
            <a href="contactus.aspx">Contact us</a>
            <label>| </label>
            <a href="feedback.aspx">Feedback</a>

        </footer>
    </div>

</form>
</body>
</html>

FOOTER の高さを設定しようとするたびに、フッターの高さが CONTENT および CONTENTMAIN div の背後にあり、CONTENT div の下に表示したいのですが、機能しません。

テスト目的で、CONTENT と CONTENTMAIN の不透明度を 0 に設定して、その背後にある FOOTER の高さが見えるようにしました。フローに従って、CONTENT divの下にFOOTERを表示したい。

更新：

クリア：フッターの両方で問題が解決しました。とにかくありがとう

4

1 に答える 1

0

これを試してみてください。これがあなたに役立つことを願っています。CSS

.footer
    {
        text-align: center;
        background-color: gray;
        font-family: "Source sans pro";
        height:100px
    }

HTML

<div class="footer">
            <a href="contactus.aspx">Contact us</a>
            <label>| </label>
            <a href="feedback.aspx">Feedback</a>

        </div>
于 2013-01-07T06:55:13.643 に答える