How will the Footer div stick to bottom of screen?

Discussion in 'ASP .Net' started by Biranchi Narayan Panda, Feb 17, 2010.

  1. I've used CSS for the master page:
    ***
    <head runat="server">
    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="styles.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <form id="form1" runat="server">
    <center>
    <div class="container">
    |<div class="header">
    | . . .
    | . . .
    | | <div class="menubar">
    | | <asp:ContentPlaceHolder ID="MenuContentPlaceHolder"
    runat="server">
    | | </asp:ContentPlaceHolder>
    | | </div>
    |
    |</div>
    <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
    </asp:ContentPlaceHolder>
    . . .
    . . .
    . . .
    . . .
    . . .

    |<div class="footer">
    | . . .
    | . . .
    |</div>

    </div>
    </center>
    </form>
    </body>
    </html>

    *****
    Stylesheet:
    __________
    body
    {
    background-image: url('images/bg.png');
    }
    ..container
    {
    background-color: #EFEFEF;
    width: 90%;
    height: 100%;
    }
    ..header
    {
    background-image: url('images/headerslice.png');
    background-repeat: repeat-x;
    text-align: left;
    vertical-align: top;
    }
    ..footer
    {
    background-image: url('images/bottomslice.png');
    background-repeat: repeat-x;
    background-position: bottom;
    }

    ***

    I want the footer to stick to the bottom of the screen, irrespective of
    screen size and body contents.

    How can I achieve this? Please help with a small example or modifications of
    this example.


    Thanks
     
    Biranchi Narayan Panda, Feb 17, 2010
    #1
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. bussiere maillist
    Replies:
    0
    Views:
    503
    bussiere maillist
    Dec 7, 2007
  2. Biranchi Narayan Panda

    How will the Footer div stick to bottom of screen?

    Biranchi Narayan Panda, Feb 17, 2010, in forum: ASP .Net
    Replies:
    2
    Views:
    1,333
    Alexey Smirnov
    Feb 17, 2010
  3. Biranchi Narayan Panda

    How will the Footer div stick to bottom of screen?

    Biranchi Narayan Panda, Feb 17, 2010, in forum: ASP .Net
    Replies:
    0
    Views:
    399
    Biranchi Narayan Panda
    Feb 17, 2010
  4. Biranchi Narayan Panda
    Replies:
    1
    Views:
    365
    Alexey Smirnov
    Feb 17, 2010
  5. Biranchi Narayan Panda
    Replies:
    1
    Views:
    2,802
    Alexey Smirnov
    Feb 17, 2010
Loading...

Share This Page