You must Sign In to post a response.
  • Category: HTML

    Image 100% height and width in a div

    Hi,

    I have been trying to get an image to adjust to the size of the divbut it only seems to work in chrome.

    I have a wrapper div 100% height and width and inside it I have a MainContent div with 100% height and 75% width as well as a menu div which is 100% height and 25% width. Inside the MainContent div I have an image which I want to stretch to the size of it.

    As i have mentioned it works fine in Chrome but in all other browsers the height doesnt seem to be working on the length of the screen which causes scrolbars to appear and I don't want that...I just need it the height to be the length of the screen resolution.

    I have tried many different ways and none of it seems to work.

    Any ideas please let me know.

    Thanks,
    John
  • #752677
    Hi,

    For your need you have to set image as a background image of a Div and set position of a div fixed and than set width ans hight 100% of a Div
    I habe created small snippet for you , just take a look.

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <style>
    .DivImage
    {
    background-image: url('Capture.PNG');
    position:fixed;
    height:100%;
    width:100%;
    }
    </style>
    </head>
    <body>
    <div class="DivImage">
    </div>
    </body>
    </html>

    You can set background repeat according to your need.
    I hope you got my point, if still you have an issue than i'll get back to you.

    Regards,
    Nirav Prabtani (Senior Web Developer)
    Email : niravjprabtani@gmail.com
    blog : niravprabtani.blogspot.in


  • Sign In to post your comments