Positioning items relative to browser window center

Discussion in 'HTML & Website Design' started by uripelli, Jan 12, 2010.

  1. #1
    Hi,

    I'm tring to design a website that will be centered whatever the screen size.

    I have a aspx page with image background, flash item on the top, under it an iframe that presents another aspx page and a footer.

    I need my background image to be displayed in the same ratio (4:3) and to stay equal to (or larger than) minimum size (1024*768).

    In the I frame I need to position a few items in certain places relative to the parent aspx (I thought about positioning relative to the top center of the window, hence the title).

    On the very bottom I need to place a footer that will apear on the center bottom of the screen whenever the iframe doesn't reach the end of the page or on the bottom center under the iframe's content, if the content is longer than the screen langth.

    I would appriciate any help on any of the problems.

    Uri
     
    uripelli, Jan 12, 2010 IP
  2. VarriaStudios

    VarriaStudios Member

    Messages:
    246
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #2
    you can change the width and height as well, play around
    example.

    body {
    background-image: url(imagesource.jpg);
    background-repeat: no-repeat;
    margin: 0px;
    padding: 0px;
    font-family: Verdana, Geneva, sans-serif;
    background-attachment: fixed;
    background-position: center top;
    text-align: center;
    }
    container{
    marginleft:auto;
    marginright: auto;

    text-align:left;

    }

    then print the out put
    <html>
    <body>
    <div id="container">
    </div>
    </body>
    </html>
     
    VarriaStudios, Jan 12, 2010 IP