PDA

View Full Version : The image can't be perfectly responsive, the height of image is over the browser.


mampwamp2
11-26-2012, 06:29 AM
The image can't be perfectly responsive, the height of image is over the browser.

http://i.imgur.com/gMyEi.jpg

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title><br />
<style>
body{
margin:0;
padding:0;
}
#royalSlider img{
width:2000px;
max-width:100%;
}

</style>
</head>

<body>
<div id="royalSlider"><img src="http://www.deviantart.com/download/338096076/viking_by_greev-d5laklo.jpg"/></img></div>
</body>
</html>

d a v e
11-26-2012, 10:57 AM
try max height instead. do you have the rights to use that picture?

mampwamp2
11-26-2012, 11:07 AM
try max height instead. do you have the rights to use that picture?

use max height instead also can't
can you try the code i give on post #1

domedia
11-26-2012, 02:50 PM
mamp, what are you expecting to happen? Do you simply want to get rid of the scrollbars?

d a v e
11-26-2012, 03:43 PM
"use max height instead also can't" what does this mean? it doesn't work when you use this and take away max width?

mampwamp2
11-26-2012, 09:32 PM
mamp, what are you expecting to happen? Do you simply want to get rid of the scrollbars?


currently it can responsive when browser resize to smaller.

but if you look carefully, some part of image can't shown when browser is maximum size, it need scroll down to see whole image.

domedia
11-27-2012, 03:53 PM
Hi mamp, there's nothing in your code that says the scrollbar should not be there. It's default behavior in all browsers.