40 users online (1 members and 39 guests)  


  Results 1 to 2 of 2

Related

  1. Replies: 1
  2. Overlapping background Images    Forum: CSS Forum
    Replies: 1
  3. Another question on Background images    Forum: HTML Forum
    Replies: 7
  4. background images    Forum: Graphics Forum
    Replies: 2
  5. Background Images    Forum: HTML Forum
    Replies: 12
  1. #1
    billystrodder's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2011
    Posts
    1

    8 Resizeable Background images in 1 page layout required

    Hello from Melbourne Australia
    I have tried and tried... I need someone to DO this for me and I Will pay $ if needed.
    I have a horizontal 1 page site with 8 sections all requiring a full background image that needs to re-size proportionally with the browser.

    Please look at .dancephotography.net.au/test1.htm

    This is an unfinished design that will become a template for other pages.
    have tried CSS trick website supersized etc.

    Grateful to anyone who can help.
    Belinda X

  2. #2
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732

    Re: 8 Resizeable Background images in 1 page layout required

    Hi there billystrodder,

    and a warm welcome to these forums.

    The following code will work in all modern browsers...
    Code:
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="language" content="english"> 
    <meta http-equiv="Content-Style-Type" content="text/css">
    
    <title>stretched background image</title>
    
    <style type="text/css">
    html,body {
        margin:0;
        padding:0;
        height:100%;
        background-image:url(http://www.dancephotography.net.au/test1_files/portraits_1.jpg);
        background-size:100% 100%;
        -webkit-background-size:100% 100%;        /*  Safari  */
        -khtml-background-size:100% 100%;         /*  Konqueror  */
        -moz-background-size:100% 100%;           /*  Firefox  */
     }
    </style>
    
    </head>
    <body>
    
    <div></div>
    
    </body>
    </html>