CSS3 background-size:cover showing unexpected behavior

irancity

New Member
I have an HTML file as shown below. It uses the "background-size:cover" setting on element.When I open the file using the File/Open option on IE9, it shows the background image covering the entire window. This is expected behavior.But, when I open the same file via an Apache server (http://127.0.0.1/test.html) the background image does NOT cover the entire window horizontally..... it leaves a blank vertical strip on the right end of the window. This is NOT expected behavior. I see the same behavior with other background image files too. It seems that when getting the HTML page from Apache server, the "background-size:cover" setting will only enlarge the image upto some extent. But when getting it using the File/Open option, it enlarges the background image enough to cover the entire element width. And, also see similar behavior with other settings of the background-size value (e.g. when I set background-size:100% 100%;).Here's the HTML file:\[code\]<html><head><style> body { background:url('desert.jpg'); background-size:cover; background-repeat:no-repeat; }</style></head><body> This is a line</body></html>\[/code\]
 
Back
Top