Fill the Whole page background from an image

Posted by Vuyiswamb under ASP.NET on 7/6/2011 | Points: 10 | Views : 10865 | Status : [Member] [MVP] [Administrator] | Replies : 4

Write New Post |

Search Forums | Answered

Resolved Posts |

Un Answered Posts |

Forums Home

Good Day All

i have a page, i am it is getting the background from an image.

<html>
<head>
<style>
 
 img.bg {
        /* Set rules to fill background */
        min-height: 100%;
        min-width: 1024px;

        /* Set up proportionate scaling */
        width: 100%;
        height: auto;

        /* Set up positioning */
        position: fixed;
        top: 0;
        left: 0;
}

@media screen and (max-width: 1024px) { /* Specific to this particular image */
        img.bg {
                left: 50%;
                margin-left: -512px;   /* 50% */
        }
}
		#page-wrap  
		{
		    position: relative;
		     width: 400px; 
		     margin: 50px auto;
		      padding: 20px;
		       background: white;
		        -moz-box-shadow: 0 0 20px black;
		         -webkit-box-shadow: 0 0 20px black;
		          box-shadow: 0 0 20px black; 
		          }
		p  
		{
		    font: 15px/2 Georgia, Serif;
		     margin: 0 0 30px 0; 
		     text-indent: 40px;
		      }
</style>
</head>
<body>
<img src="http://196.41.221.20:8095/EcashPos/images/MainBackground.jpg" class="bg">
</body>
</html>

in Firefox this is fine, but in IE it only fills a portion of the page. i have attached the example document, or you can use this one.

i am using IE9

Thanks

Attachment

Thank you for posting at Dotnetfunda
[Administrator]

Reply | Reply with Attachment

Alert Moderator

Responses

Posted by: Nithadeepak on: 7/6/2011 [Member] Bronze | Points: 25

0	Sir, its working fine in IE8 Nitha Deepak Vuyiswamb, if this helps please login to Mark As Answer. \| Alert Moderator

Posted by: Vuyiswamb on: 7/6/2011 [Member] [MVP] [Administrator] NotApplicable | Points: 25

0	try it in IE9 Thank you for posting at Dotnetfunda [Administrator] Vuyiswamb, if this helps please login to Mark As Answer. \| Alert Moderator

Posted by: Nithadeepak on: 7/7/2011 [Member] Bronze | Points: 25

0	Sir please try this ..... body { background:url(http://196.41.221.20:8095/EcashPos/images/MainBackground.jpg); background-size:100% 100%; background-repeat:no-repeat; } Nitha Deepak Vuyiswamb, if this helps please login to Mark As Answer. \| Alert Moderator

Posted by: Vuyiswamb on: 7/7/2011 [Member] [MVP] [Administrator] NotApplicable | Points: 25

0	same thing it does not work in IE9 Thank you for posting at Dotnetfunda [Administrator] Vuyiswamb, if this helps please login to Mark As Answer. \| Alert Moderator

Latest Posts